babel

一.“源码”到“源码”的编译：转换编译

Babel 的一切都是简单的插件，谁都可以创建自己的插件（就是一个函数），利用 Babel 的全部威力去做任何事情。
babel6中主要包括预设preset和 插件plugin两个字段的配置
项目的根目录创建一个.babelrc文件，添加内容：

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

二.通过一个简单的例子理解babel

1.新建一个babel文件夹，然后初始化一个package.json文件...
另外再创建两个文件夹, src(用于存放编译前的文件), lib(用于放编译后的文件)。

$ mkdir babel
$ cd babel
$ npm init -y  //可以快速创建一个package.json文件
$ mkdir src
$ mkdir lib
第3步   $ npm install --save-dev babel-cli
第4步   $ npm install --save-dev babel-plugin-transform-es2015-arrow-functions
第5步   $ npm install --save-dev babel-preset-es2015

2.在src目录下创建一个index.js文件，并写入es6规范的js代码

let sum = (num1, num2) => num1 + num2;
console.log(sum(3,4));

3.这里只想用命令行工具对代码进行编译.（babel-cli 命令行工具）。要安装这个包，npm install --save-dev babel-cli。安装之后，这里用到一个命令，”babel src –d lib”为了使用这个命令, 我们需要把这个命令放到 npm scripts 中. 打开package.json 文件找到 scripts , 添加 “build”: “babel src –d lib” 以后在 命令行中输入npm run build, 就可以执行编译。
4.我们看到 lib文件夹多了index.js, 但却是原样输出，并没有转换成es5的语法。
也就是说，即时我们安装了Babel, 它也没有用来转换ES5代码的功能, 还需要安装相应的插件。这里，我们用到了箭头函数，所以安装箭头函数插件：npm install --save-dev babel-plugin-transform-es2015-arrow-functions， 为了方便对插件进行管理，Babel 提供了它自己的配置文件 .babelrc 文件，每安装一个插件就编写一下写入 ｛"plugins": ["transform-es2015-arrow-functions"] ｝这时再运行 npm run build， 可以看到，编译成功了。箭头函数被转换过来了，但是let还没转。
5.主要是因为一个插件只做一件事情。如果我们的代码中，大批量的使用es6的特性，那么我们就要列出很多个插件，这非常不方便，所以Babel 提供了插件预设preset。装完之后，在.babelrc 文件中添加"presets": ["es2015"]

三.babel-node

四.babel-register

babel-register模块改写require命令，为它加上一个钩子。此后，每当使用require加载.js、.jsx、.es和.es6后缀名的文件，就会先用Babel进行转码。

五.babel-core

如果某些代码需要调用Babel的API进行转码，就要使用babel-core模块。

var babel = require('babel-core');
// 字符串转码
babel.transform('code();', options);
// => { code, map, ast }
// 文件转码（异步）
babel.transformFile('filename.js', options, function(err, result) {
  result; // => { code, map, ast }
});
// 文件转码（同步）
babel.transformFileSync('filename.js', options);
// => { code, map, ast }
// Babel AST转码
babel.transformFromAst(ast, code, options);
// => { code, map, ast }

六.babel-polyfill

Babel默认只转换新的JavaScript句法（syntax），而不转换新的API，比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象。$ npm install --save babel-polyfill，，，然后再脚本添加import 'babel-polyfill';或者require('babel-polyfill');