ES6环境的搭建步骤

• 步骤一：在自己电脑里面选择一个盘新建一个文件夹，例如es6use文件夹
  
• 步骤二：在es6use文件夹下建立一个src文件夹、一个dist文件夹、一个index.html文件（其中src文件夹用来存放自己用es6语法写的js文件；dist文件夹用来存放es6转换为es5语法的js文件）
  
  其中的node_modules是我最后安装babel转换包的时候生成的，演示的时候忘记删除了，你在目录下最后也会生出这个文件
• 步骤三：在src文件夹下面建立一个index.js文件，并在该文件下面写入下面内容用来测试；再在index.html文件里面引入该文件：< script src="./dist">< /script>,因为最后要用的是转换为es5的js文件
  
• 步骤四：对项目进行初始化，在控制台切换到es6use目录下，输入"npm init -y"即生成一个package.json文件，打开文件内容如下
  
  
• 步骤五：开始环境的搭建。先输入”npm install babel-cli -g"对bebal进行全局安装，如果网速较慢，可以使用cnpm；接着再输入"npm install --save-dev babel-preset-es2015 babel-cli“，将babel-preset-es2015和babel-cli进行本地安装，安装成功后就会package.json文件中有记录,多了devDependencies这一项
  
• 步骤六：在es6use目录下新建一个 .babelrc文件，在文件中输入：
  
• 步骤七：在控制台输入"babel src/index.js -o dist/index.js"，-o表示输出，即将src下的文件index.js通过babel转换器转换后输出到dist文件夹下的index.js文件。会发现dist文件夹下自动生成了index.js文件，内容是转换过来的es5语法，如下
  
  这就说明环境搭建成功了，自己可以多进行几次测试，即在src文件下建立js文件用es6语法写入，在终端或cmd中输入命令babel src/index.js -o dist/index.js，再在dist文件下来看下语法是否转换过来，最后在index.html中引入dist里的js文件来使用
• 如果想使用简单一点的转换命令可以通过在package.json文件中的scripts属性进行更改：如下
  
  再在控制台输入npm run build可以得到相同效果