1.react生命周期:

2.脚手架工具【yeoman】:
官网

3.查看全局generator生成列表:

npm ls -g --depth=1 2>/dev/null | grep generator-

4.安装generator-react-webpack:

npm install -g generator-react-webpack

4.创建初始化项目:

yo react-webpack your-project-name

5.脚手架说明:
.editorconfig: 不同编辑器统一风格,官网
.gitignore: git提交过滤的文件、目录
.eslintrc:包含jshintrc
.jshintrc:
.yo-rc.json:
karma.conf.js:测试文件
package.json:node依赖
webpack.config.js:webpack开发环境配置
webpack.dist.config.js:webpack生产环境配置

6.react全局对象:

\_\_REACT\_DEVTOOLS\_GLOBAL\_HOOK\_\_

7.webpack配置:
官网
output:输出
entry:输入
resolve:模块解析项
cache:true: 增量编译
debug:true: 调试模式
devtool:’sourcemap’:
stats: {
     colors: true, // 颜色
     reasons: true // 为什么被引入
}: 输入相关

webpack-dev-server:{ hot: true, // 热部署 }
plugins: {
     DedupePlugin(): 检测相似文件、或者文件中重复内容
     UglifyJsPlugin(): 压缩输出
     OccurenceOrderPlugin(): 根据引用频率决定bind-id，越频繁、值越短，达到减小文件目的
     AggressiveMergingPlugin(): 用来优化生成的代码chunk，合并相同代码，提取公共的相同的代码片段
     NoErrorsPlugin(): 保证编译不会出错
}

##ps:备注
1.dev模式下,output生成在内存中，而非磁盘中
2.__dirname:当前目录
3.localhost:port/webpack-dev-server:建议访问url 4.transpiling(相同层级的编译:ES6->ES5)/compiling(不同层级的编译)

8.grunt beginner: