使用 Babel.js 进行 Transpile Async Await 提案？

有提案引入C#风格async-await。我知道 Babel.js 将 ES6 转译为 ES5，但是有没有办法让它将 async-await 转译为ES5?

Babel v6

从 Babel v6 开始，Babel 本身不再包含任何 Transformer。你必须明确地指定任何功能 https://babeljs.io/docs/plugins/你想要转变。

预设 - 非 ES2015 环境

使其工作的最快方法是使用presets其中已经包含转换 ES2015 和更新提案所需的一组插件。为了async，你将需要es2015 https://babeljs.io/docs/plugins/preset-es2015/ and es2017 https://babeljs.io/docs/plugins/preset-es2017/预设和runtime https://babeljs.io/docs/plugins/transform-runtime/插件（不要忘记安装babel-runtime如文档中所述）：

{
  "presets": [
    "es2015",
    "es2017"
  ],
  "plugins": [
    "transform-runtime"
  ]
}

预设 - ES2015 环境

如果您在支持 ES2015（更具体地说，生成器和 Promises）的环境中运行代码，那么您所需要的只是 es2017 预设：

{
  "presets": [
    "es2017"
  ]
}

Custom

只为了改造async功能，您将需要以下插件。

syntax-async-functions https://babeljs.io/docs/plugins/syntax-async-functions/在任何情况下都需要能够解析异步函数

为了runasync 函数，您要么需要使用

• transform-async-to-generator https://babeljs.io/docs/plugins/transform-async-to-generator/：转换async函数进入生成器。这将使用 Babel 自己的“协同例程”实现。
• transform-async-to-module-method https://babeljs.io/docs/plugins/transform-async-to-module-method/: 还转换async函数传递给生成器，但将其传递给配置中指定的模块和方法，而不是 Babel 自己的方法。这允许您使用外部库，例如bluebird.

如果您的代码在支持生成器的环境中运行，则无需执行任何操作。但是，如果目标环境确实not支持发电机，你还必须改造发电机。这是通过transform-regenerator https://babeljs.io/docs/plugins/transform-regenerator/转换。这个转换依赖于运行时函数，所以你还需要 Babel 的transform-runtime https://babeljs.io/docs/plugins/transform-runtime/变换（+babel-runtime包裹）。

例子：

异步到生成器

{
  "plugins": [
    "syntax-async-functions",
    "transform-async-to-generator"
  ]
}

异步模块方法

{
  "plugins": [
    "syntax-async-functions",
   ["transform-async-to-module-method", {
     "module": "bluebird",
     "method": "coroutine"
   }]
  ]
}

异步到生成器 + 再生器

{
  "plugins": [
    "syntax-async-functions",
    "transform-async-to-generator",
    "transform-regenerator",
    "transform-runtime"
  ]
}

Babel v4 及更早版本

是的，您必须启用实验变压器 http://babeljs.io/docs/usage/experimental/。巴别塔使用再生器 https://github.com/facebook/regenerator.

Usage

$ babel --experimental

---

babel.transform("code", { experimental: true });