选装一个 $ 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
1.4) 根据官网的提示，当我们用npm安装好这些插件工具之后，我们需要将这些规则加入到.babelrc中去。如下所示：
{ "presets": [ "es2015", "react", "stage-2" ], "plugins": [] }
1.5) 转码、转码的规则：
# 转码结果输出到标准输出 $ babel test.js # 转码结果写入一个文件 # --out-file 或 -o 参数指定输出文件 $ babel a.js --out-file b.js # 或者 $ babel a.js -o b.js # 整个目录转码 # --out-dir 或 -d 参数指定输出目录 $ babel src --out-dir lib # 或者 $ babel src -d lib # -s 参数生成source map文件 $ babel src -d lib -s
2、工具配置法：
实际上，我们可以通过前端自动化的很多工具来实现ES6的转码配置，比如，常见的grunt、gulp、Webpack和Node等。下面我就简单的说下我较为熟悉的gulp配置法。
点击此处到Babel中文官网Tool配置页面：Babel Tool
2.1) 首先，我们需要在项目中安装gulp：
$ npm install gulp --save-dev
2.2) 然后，我们需要在项目中安装gulp-babel：
$ npm install --save-dev gulp-babel
当执行完上面的两个命令后，我们会发现根目录下的package.json文件内容已经被自动修改成：
{ "devDependencies": { "babel-cli": "^6.22.2", "gulp": "^3.9.1", "gulp-babel": "^6.1.2" } }
2.3) 编写gulpfile.js文件，文件内容如下所示：
var gulp = require("gulp"); var babel = require("gulp-babel"); gulp.task("default", function () { return gulp.src("src/a.js") .pipe(babel()) .pipe(gulp.dest("lib")); });
当我们在当前项目目录下运行如下命令后，会发现原本在src文件夹中的a.js(按照ES6标准编写的)文件已经被转码成ES5标准的a.js，并放在了lib文件夹里面。
$ gulp default #或者用下面的命令也行 $ gulp