node 配置 babel 的使用

一、配置文件.babelrc

.babelrc 文件存放在项目的根目录下。

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

presets 字段设定转码规则，你可以根据需要安装。

$ npm install --save-dev babel-preset-es2015 
# react转码规则
$ npm install --save-dev babel-preset-react
# ES7不同阶段语法提案的转码规则（共有4个阶段），选装一个,其中0最厉害
$ 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

然后，将这些规则加入.babelrc

{ 
  "presets": [ 
      "es2015",
      "react", 
      "stage-2" 
    ], 
  "plugins": [] 
}

注意，以下所有Babel工具和模块的使用，都必须先写好.babelrc

二、对于ES7async的支持

使用 eES7的async 会报：

ReferenceError: regeneratorRuntime is not defined".

$ npm i --save-dev babel-plugin-transform-runtime

在 .babelrc 文件中添加：
"plugins": [[
    "transform-runtime",
    {
      "helpers": false,
      "polyfill": false,
      "regenerator": true,
      "moduleName": "babel-runtime"
    }
  ]]

三、命令行转码babel-cli

Babel提供babel-cli 工具，用于命令行转码。

$ npm install --global babel-cli

# 转码结果输出到标准输出
$ babel example.js
# 转码结果写入一个文件 
#