babel 转es5

1.配置文件.babelrc

a.Babel的配置文件是.babelrc，存放在项目的根目录下。使用Babel的第一步，就是配置这个文件。

该文件用来设置转码规则和插件，基本格式如下。

{

  "presets": [],
  "plugins": []
}
b.cd到项目根文件夹

这是es2015转码规则
npm install --save-dev babel-preset-es2015

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

{

"presets": [

"es2015"

],

"plugins": []

}

2.命令行转码babel-cli

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

它的安装命令如下，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

上面代码是在全局环境下，进行Babel转码。这意味着，如果项目要运行，全局环境必须有Babel，也就是说项目产生了对环境的依赖。另一方面，这样做也无法支持不同项目使用不同版本的Babel。

一个解决办法是将babel-cli安装在项目之中。

# 安装
$ npm install --save-dev babel-cli

然后，改写package.json。

{
  // ...
  "devDependencies": {
    "babel-cli": "^6.0.0"
  },
  "scripts": {
    "babel": "babel src -d lib"
  },
}

转码的时候，就执行下面的命令。

$ npm run babel