RIGHTFE
========
是什么?
rightFe是前端工程化开发工具, 其中包含了
- 本地开发环境支持、前后端联调环境支持(前后端分离)
- 静态文件编译功能: css/js
- 模块化开发
特点
- 基于gulp+webpack
- 提供的命令简洁,用户使用方便
如何安装
安装之前的准备
nodejs & npm
安装
npm install rightfe -g
使用
rightfe {命令名} --help
本地开发:
rightfe server
代理:
rightfe server -o beta.bm.xxx.com:8150
发布:
rightfe publish
rightfe.config
{
//配置项目开发环境 和 线上环境根目录
root: {
src: './src',
dest: './public'
},
//相对根目录
js: {
src: 'js',
dest: 'static/js',
extensions: ['js', 'json', 'tpl'],
babel: {
presets: ['es2015', 'stage-1'],
plugins: []
},
extractSharedJs: false
},
//相对根目录
css: {
src: 'static/css',
dest: 'static/css',
autoprefixer: {
browsers: ['last 3 version']
},
sass: {},
extensions: ['scss', 'sass', 'css']
},
//相对根目录
html: {
src: 'html',
dest: 'html',
htmlmin: {
collapseWhitespace: true
},
extensions: ['html', 'json']
},
//webpack entry文件配置
entries: {},
//别名配置
alias: {},
//发布配置
production: {
//去缓存版本号
rev: true
}
}
如果遇到找不到一些loader模块的,在具体工程的package.json中加入
"devDependencies": {
"babel-core": "^6.11.4",
"babel-loader": "^6.2.4",
"babel-plugin-transform-runtime": "^6.9.0",
"babel-preset-es2015": "^6.9.0",
"babel-preset-stage-1": "^6.5.0",
"css-loader": "^0.23.1",
"node-sass": "^3.8.0",
"sass-loader": "^4.0.0",
"style-loader": "^0.13.1",
"vue-hot-reload-api": "^1.3.3",
"vue-html-loader": "^1.2.3",
"vue-loader": "^8.5.3",
"vue-style-loader": "^1.0.0",
"webpack-hot-middleware": "^2.12.2"
},
"dependencies": {
"ejs-loader": "^0.3.0",
"html-loader": "^0.4.3"
}