ES6开发环境搭建（Babel把ES6编译成ES5 + live-server服务器）

1.新建项目工程加目录

src：书写ES6代码的文件夹。
dist：利用Babel编译成ES5代码的文件夹，在html页面需要引入这个文件夹里面的js文件。

2.编写src下的index.js 文件

3. 初始化项目

在安装Babel之前，需要用npm init先初始化我们的项目，在终端输入 npm init -y
命令执行完成后，会在项目的根目录生成 package.json 文件

可以根据自己的需要进行修改 package.json 文件的配置。

4.全局安装Babel-cli

在终端输入 npm install -g babel-cli 命令执行完成后，
再输入 babel src/index.js -o dist/index.js，现在dist目录下确实生成了一个index.js文件，里面的代码还是ES6的代码语法。因为需要安装转换包才能成功转换（继续往下看）。

5.本地安装bable-preset-es2015 和 babel-cli

在终端输入 npm install --save-dev babel-preset-es2015 babel-cli 安装完成后， package.json 文件多了devDependencies选项。

6. 项目跟目录新建.babelrc文件，并打开录入一下代码。

控制台输入：babel src/index.js -o dist/index.js，成功把ES6代码编译成ES5代码。

7. 全局安装 live-server

在终端输入 npm install live-server -g 命令执行完成后，
再输入 live-server 来启动服务，这时候浏览器就会打开首页，每次更改代码保存完毕，浏览器会自动刷新。live-server服务器很好用的哦！