Babel 转码器

babel 是一个广泛使用的 ES6 转码器， 可以将 ES6 代码转为 ES5 代码， 从而在老版本的浏览器执行，你可以用 ES6 的方式编写程序，又不用担心现有环境是否支持。 下面是一个例子：

上面的原始代码用了箭头函数，Babel 将其转为普通函数，就能在不支持箭头函数的Javascript 环境执行了。

下面的命令在项目目录中，安装 Babel。

---

配置文件.babelrc

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

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

presets 字段设定转码规则，官方提供以下的规则集，你可以根据需要安装。

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

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

---

命令行转码

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

它的安装命令如下：

基本用法如下：

---

babel - node

@babel/node 模块的 babel-node 命令，提供一个支持 ES6 的 REPL 环境。它支持 Node 的 REPL 环境的所有功能，而且可以直接运行ES6 代码。

首先，安装这个模块。

然后，执行 babel-node 就进入 REPL 环境。

Babel-node 命令可以直接运行 ES6 脚本，将上面的代码放入脚本文件 es6.js ，然后直接运行。

---

@babel/register 模块

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

使用时，必须首先加载 @babel/register 。

然后，就不需要手动对 index.js 转码了。

需要注意的是，@babel/register 只会对 require命令加载的文件转码，而不会对当前文件转码。另外，由于它是实时转码，所有只适合在开发环境使用。

---

babel API

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

配置对象 options ，可以参考官方文档 http://babeljs.io/docs/usage/options/。

下面是一个例子：

上面代码中，transform 方法的第一个参数是一个字符串，表示需要被转换的 ES6 代码，第二个参数是转换的配置对象。

---

@babel/polyfill

Babel 默认值转换新的 Javascript 句法（syntax），而不转换新的 API ，比如 Iterator ， Generator ， Set ， Map ，Proxy ， Reflect , Symbol , Promise 等全局对象，以及一些定义在全局对象上的方法（比如 Object.assign ）都不会转吗。

距离来说，ES6 在 Array 对象上新增了 Array.from 方法。Babel 就不会转码这个方法。如果想让这个方法运行，必须使用 babel-polyfill ，为当前环境提供一个垫片。

安装命令如下：

然后，在脚本头部，加如下一行代码：

Babel 默认不转码的 API 非常多，详细清单可以查看 babel-plugin-transform-rutime 模块的 definitions.js 文件。

---

浏览器环境

Babel 也可以用于浏览器环境 ， 使用 @babel/standalone 模块提供的浏览器版本，将其插入网页：

注意：网页实时将 ES6 代码转为 ES5 ，对性能有影响。生产环境需要加载已经转码完成的脚本。

Babel 提供一个 REPL 在线编译器，可以在线将  ES6 代码转为 ES5 代码。转换后的代码，可以直接作为 ES5 代码插入网页运行。