Babel 是一个用于 JavaScript 的通用多用途编译器，使用 Babel 可以使用（或创建）下一代 的JavaScript，以及下一代 JavaScript 工具。
作为一门语言，JavaScript 不断发展，带来了很多新的规范和建议，使用 Babel 可以让你在这些新的规范和建议全面普及之前就提前使用它们。
Babel 通过将最新标准的 JavaScript 代码编译为已经在目前可以工作的代码来实现上一段提到的内容。这个过程被称为 “源代码到源代码” 的编译，这也被成为 “转换”。
例如，Babel 可以将最新的 ES2015 的箭头函数语法从：
const square = n => n * n;
转换成下面的内容：
const square = function square(n) {
return n * n;
};
然而，Babel 可以胜任更多的工作，因为Babel 支持语法扩展，例如 React 的 JSX 语法 域名交易 或者静态类型检查的 Flow 语法。
更近一步，在 Babel 中一切皆插件，而每个人都可以充分利用 Babel 的强大能力来创建属于自己的插件。且 Babel 被组织成几个核心的模块，允许用户利用这些模块来构建下一代 JavaScript 工具链。
许多人也是这样去做的，Babel 的生态系统正在茁长的成长。在这本 Babel 手册中，我将讲解 Babel 内建的一些工具以及社区里的一些拥有的工具。
因为 JavaScript 社区没有标准的构建工具，框架或平台等，Babel 官方性与其他所有的主要工具进行了集成。无论是来自 Gulp、Browserify，或者是 Ember、Meteor，亦或是 Webpack 等，无论你的启动工具是什么，Babel 都存在一些官方性的集成。
就本手册而言，我们将介绍设置Babel的内置方法，但是您也可以访问交互式设置页面[1]以了解所有集成。
注意：本指南将参考诸如 node 和 npm 之类的命令行工具。在继续进行任何操作之前，您应该对这些工具感到满意。
Babel的CLI是从命令行使用Babel编译文件的简单方法。
让我们首先在全局安装它以学习基础知识。
$ npm install --global babel-cli
我们可以像这样编译我们的第一个文件：
$ babel my-file.js
这会将编译后的输出直接转储到您的终端中。要将其写入文件，我们将指定 --out-file 或 -o 。
$ babel example.js --out-file compiled.js
# or
$ babel example.js -o compiled.js
如果我们想将整个目录编译成一个新目录，可以使用 --out-dir 或 -d 来完成。
$ babel src --out-dir lib
# or
$ babel src -d lib
虽然您可以在计算机上全局安装Babel CLI，但最好逐个项目在本地安装它。
这有两个主要原因。
同一台计算机上的不同项目可能取决于Babel的不同版本，从而允许您一次更新一个版本。
这意味着您对工作的环境没有隐式依赖。使您的项目更加可移植且易于设置。
我们可以通过运行以下命令在本地安装Babel CLI：
$ npm install --save-dev babel-cli
注意：由于在全局范围内运行 Babel 通常是一个坏主意，因此您可能需要通过运行以下命令来卸载全局副本：
$ npm uninstall --global babel-cli
完成安装后，您的 package.json 文件应如下所示：
{
"name": "my-project",
"version": "1.0.0",
"devDependencies": {
"babel-cli": "^6.0.0"
}
}
现在，与其直接从命令行运行 Babel，不如将命令放入使用本地版本的 npm 脚本中。只需在您的 package.json 中添加一个 “script” 字段，然后将 babel 命令放入其中即可进行构建。
{
"name": "my-project",
"version": "1.0.0",
+ "scripts": {
+ "build": "babel src -d lib"
+ },
"devDependencies": {
"babel-cli": "^6.0.0"
}
}
现在，从我们的终端我们可以运行：
npm run build
这将以与以前相同的方式运行Babel，只是现在我们正在使用本地副本。
运行Babel的下一个最常见的方法是通过 babel-register 。通过此选项，您仅需要文件即可运行 Babel，这可能会更好地与您的设置集成。
请注意，这并非供生产使用。部署以这种方式编译的代码被认为是不好的做法。最好在部署之前提前进行编译。但是，这对于构建脚本或您在本地运行的其他事情非常有效。
首先让我们在项目中创建一个 index.js 文件。
console.log("Hello world!");
如果我们使用 node index.js 来运行它，那么 Babel 不会编译它。因此，我们需要先设置 babel-register 。
首先安装 babel-register 。
$ npm install --save-dev babel-register
接下来，在项目中创建一个 register.js 文件，并编写以下代码：
require("babel-register");
require("./index.js");
这是在 Node 的模块系统中注册 Babel 并开始编译每个 require 的文件。
现在，我们可以使用 node egister.js 代替运行 node index.js 。
$ node register.js
注意：您不能在要编译的文件中注册 Babel。在 Babel 有机会编译文件之前，Node 正在执行文件。
require("babel-register");
// not compiled:
console.log("Hello world!");
如果您只是通过 node CLI 运行某些代码，则集成 Babel 的最简单方法可能是使用 babel-node CLI，这在很大程度上只是对 node CLI 的替代。
请注意，这并非供生产使用。部署以这种方式编译的代码被认为是不好的做法。最好在部署之前提前进行编译。但是，这对于构建脚本或您在本地运行的其他事情非常有效。
首先，请确保您已安装 babel-cli 。
$ npm install --save-dev babel-cli
**注意：**如果您想知道为什么要在本地安装此软件，请在上面的项目部分中阅读 “从项目中运行 Babel CLI”。
然后，将运行 node 的任何位置替换为 babel-node 。
如果您使用的是 npm script ，则只需执行以下操作：
{
"scripts": {
- "script-name": "node script.js"
+ "script-name": "babel-node script.js"
}
}
否则，您将需要写出通向 babel-node 本身的路径。
如果出于某种原因需要在代码中使用 Babel，则可以使用 babel-core 软件包本身。
首先安装 babel-core 。
$ npm install babel-core
var babel = require("babel-core");
如果您具有 JavaScript 字符串，则可以直接使用 babel.transform 对其进行编译。
babel.transform("code();", options);
// => { code, map, ast }
如果使用文件，则可以使用异步api：
babel.transformFile("filename.js", options, function(err, result) {
result; // => { code, map, ast }
});
如果您出于任何原因已经拥有Babel AST，则可以直接从AST转换。
babel.transformFromAst(ast, code, options);
// => { code, map, ast }
对于上述所有方法， options 可以传递指南可以从这里了您现在可能已经注意到，仅运行 Babel 似乎除了将 JavaScript 文件从一个位置复制到另一个位置之外没有执行任何其他操作。
这是因为我们尚未告诉 Babel 该做什么事情。
由于Babel是通用编译器，它以多种不同的方式使用，因此默认情况下它不会执行任何操作。您必须明确告诉Babel 它应该做什么。
您可以通过安装 plugins 或 presets （plugins 组）为Babel提供操作说明。
在我们开始告诉 Babel 怎么做之前。我们需要创建一个配置文件。您需要做的就是在项目的根目录下创建一个 .babelrc 文件。从这样开始：
该文件是您配置 Babel 以执行所需操作的方式。
注意：虽然您还可以通过其他方式将选项传递给 Babel，但 .babelrc 文件是约定俗成的，也是最好的方法。
让我们首先告诉 Babel 将 ES2015（JavaScript标准的最新版本，也称为ES6）编译为ES5（当今大多数JavaScript环境中可用的版本）。
我们将通过安装“ es2015” Babel预设来做到这一点（当然目前浏览器支持了绝大部分 ES2015 的特性了，这里是用作演示，使用形式是一致的）：
$ npm install --save-dev babel-preset-es2015
接下来，我们将修改 .babelrc 以包括该预设。
设置 React 同样简单。只需安装预设：
$ npm install --save-dev babel-preset-react
然后将预设添加到您的 .babelrc 文件中：
{
"presets": [
流程纳入标准。
此过程分为5个阶段（0-4）。随着提案获得更大的吸引力，并更有可能被采纳为标准，它们经历了各个阶段，最终在阶段4被接纳为标准。
这些以babel的形式捆绑为4种不同的预设：
babel-preset-stage-0
babel-preset-stage-1
babel-preset-stage-2
babel-preset-stage-3
请注意，没有阶段 4 的 preset ，因为它只是上面的 es2015 预设。
这些预设中的每个预设都需要用于后续阶段的预设。即 babel-preset-stage-1 需要 babel-preset-stage-2 ，而 babel-preset-stage-3 也需要。
安装您感兴趣的 stage 很简单：
$ npm install --save-dev babel-preset-stage-2
然后，您可以将其添加到您的 .babelrc 配置中。