使用babel写ES6语法

写在前面

• 本篇文章教你如何用babel写ES6语法。
• 适合新手。
• 环境：node.js

babel

开始

1. 新建一个项目

   mkdir babel-use-demo

2. 进入项目

   cd babel-use-demo

3. 初始化npm

   npm init -y

4. 安装依赖

   npm install –save-dev babel-cli

5. 新建src文件夹和lib文件夹，新建index.html文件

   mkidr src
   mkidr lib
   touch index.html

6. 在html文件中写代码

   <script src="./lib/index.js"></script>

7. 进入src文件，新建index.js，写代码

       class People{
           constructor(name){
               this.name = name;
           }
       }
       let peo = new People('ZT');
       console.log(peo.name);

8. 修改package.json文件，添加build脚本

   “scripts”: {
   “build”: “babel src -d lib”//lib 是编译完成转化为ES5的代码的文件夹，src是ES6代码的文件夹
   }

9. 安装依赖

   npm install babel-preset-es2015 –save-dev

10. 新建.babelrc文件

    {
    “presets”: [“es2015”]
    }

11. 运行

    npm run build

12. 打开浏览器，打开控制台，你会看见 ZT

13. .babelrc文件和index.html文件应该在根文件夹下。

写在后面

• 源代码 github地址：https://github.com/ZT1996/es6-install-demo