基于React + Webpack + Babel的项目脚手架

这个脚手架工程模板用于快速启动基于 React + Webpack 为技术栈的前端项目

Features 功能特性

• 可以解析 JSX 语法
• 可以解析 ES6 语法新特性
• 支持 LESS 预处理器
• 支持 SASS 预处理器
• 编译完成自动打开浏览器
• 区分开发环境和生产环境
• 实现组件级热更新
• 实现代码的热替换，浏览器实时刷新查看效果
• 分离业务功能代码和公共依赖代码
• 单独分离 CSS 样式文件
• 支持编译 HTML 模板
• 支持文件 MD5 戳，解决文件缓存问题
• 支持图片、图标字体等资源的编译
• 支持浏览器源码调试
• 可以进行代码规则校验
• 支持 mocha 测试用例运行
• 支持一行命令产出待部署资源

1. start

$ git clone https://github.com/GuoYongfeng/webpack-dev-boilerplate
$ cd webpack-dev-boilerplate
$ npm install

2. dev

2.1 开发调试

//首先运行dll预打包
$ npm run start:pre
//打包完成，启动项目
$ npm start

查看效果

http://127.0.0.1:9090

2.2 代码检查

$ npm run lint

2.3 测试用例

$ npm run test:watch

2.4 产出资源

$ npm run build

3. 技术栈

• [x] Webpack
• [x] React
• [x] ES6
• [x] Redux
• [x] React-router
• [x] react-router-redux
• [x] Babel
• [ ] Autoprefixer
• [ ] PostCSS
• [x] CSS modules
• [x] Less
• [x] Sass
• [x] Eslint