babel

Babel 转码器

1. .babelrc 存放在项目的根目录下

1. 基本格式

   {
     "presets": [],
     "plugins": []
   }
   

2. presets字段设定转码规则

   # 最新转码规则
   $ npm install --save-dev babel-preset-latest
   
   # react 转码规则
   $ npm install --save-dev babel-preset-react
   
   # 不同阶段语法提案的转码规则（共有4个阶段），选装一个
   $ npm install --save-dev babel-preset-stage-0
   $ npm install --save-dev babel-preset-stage-1
   $ npm install --save-dev babel-preset-stage-2
   $ npm install --save-dev babel-preset-stage-3
   
   {
       "presets": [
         "latest",
         "react",
         "stage-2"
       ],
       "plugins": []
   }
   

2. 转码

1. 命令行

   $ npm install --global babel-cli
   
   # 转码结果输出到标准输出
   $ babel example.js
   
   # 转码结果写入一个文件
   # --out-file 或 -o 参数指定输出文件
   $ babel example.js --out-file compiled.js
   # 或者
   $ babel example.js -o compiled.js
   
   # 整个目录转码
   # --out-dir 或 -d 参数指定输出目录
   $ babel src --out-dir lib
   # 或者
   $ babel src -d lib
   
   # -s 参数生成source map文件
   $ babel src -d lib -s
   
   

2. 将babel-cli安装在项目之中

   # 安装
   $ npm install --save-dev babel-cli
   
   #然后，改写package.json。
   {
     // ...
     "devDependencies": {
       "babel-cli": "^6.0.0"
     },
     "scripts": {
       "build": "babel src -d lib"
     },
   }
   #转码
   $ npm run build
   

3. babel-node babel-cli工具自带一个babel-node命令，提供一个支持 ES6 的 REPL 环境

   执行`babel-node`就进入 REPL 环境。
   
   #直接运行 ES6 脚本
   babel-node es6.js
   
   #babel-node也可以安装在项目中。
   $ npm install --save-dev babel-cli
       #然后，改写package.json。
   {
     "scripts": {
       "script-name": "babel-node script.js"
     }
   }
   

4. babel-core 调用 Babel 的 API 进行转码

---

本文来源个人对 阮一峰es6 总结，以供今后查阅。