了解 Babel

BABEL

Babel 是一个 JavaScript 编译器（compiler）。

主要用于在旧版浏览器或环境中将ECMAScript 2015+代码转换为向后兼容的JavaScript版本。

JavaScript 语言的标准规范在每一年都会有所更新，运用 Babel 编译器让ECMAScript 2015+的代码转换为向后兼容（ECMAScript 2015或ECMAScript 2015之前版本）的代码，能够使得开发人员在写代码的时候完全不需要考虑运行时对新语法特性的支持程度。

编译阶段

编译代码的过程分为3个阶段：

  1. 析（parsing）：通过 babylon 解析成 AST
  2. 转换（transforming）：All the plugins/presets ，进一步的做语法等自定义的转译，仍然是 AST
  3. 生成（generation）：最后通过 babel-generator 生成 output string

对于 Babel 的编译过程，解析是基础，插件是核心，所有的语法转换的工作全部由插件完成，不同的插件负责不同的语法转换，比如plugin-transform-es2015-arrow-functions这个插件就只负责对箭头函数语法的转换。

预设

预设（preset）：插件的集合。

最常见的预设配置为env + stage-3。

{
  "presets": [ "env","stage-3" ]
}

Polyfill

因为babel的转译只是语法层次的转译，例如箭头函数、解构赋值、class，对一些新增api以及全局函数（例如：Promise）无法进行转译，这个时候就需要在代码中引入babel-polyfill，让代码完美支持ES6+环境。

参考

Babel · The compiler for next generation JavaScript
Babel · 用于编写下一代 JavaScript 的编译器 | Babel中文网
Babel 详解