babel环境的搭建

1). 安装babel:cnpm i babel-cli  -g

2). npm init

3). cnpm i babel-cli -D

4). cnpm i babel-preset-es2015 -D(es6的预设)

5). cnpm i babel-preset-react -D

6). css-loader加载css文件

7). style-loader将加载的css文件加入页面中（二者组合在一起使你能够把样式表嵌入webpack打包后的JS文件中）

8). sass-loader把scss处理成css

(webpack的用处 编译css，js)

babel:

1. babel src -d prd prd可以实现把src中的js编译放到prd文件夹（编译的语句可以放到package.json文件中添加一个build，在用npm run build，这个build可以自己命名）

2. babel src  -w -d prd可以实现自动检测编译

3.    创建一个.babel文件 {

"presets":["es2015"，"react"]

}

注意：如果在运行过程中遇到 Cannot find module 'readdirp'这种错误就是安装的有问题，可以重新安装，也可以针对缺少的部分单独安装（单独安装的语法，cnpm i 缺少的组件），

解析Es6的babel-preset-es2015包

解析JSX的babel-preset-react包

babel用于把ES6编译成ES5

react用的是虚拟dom