有一个引入C#style async-await
的提议。我知道Babel.js将ES6转换为ES5,但有没有办法让它转换为async-await到ES5
?
答案 0 :(得分:99)
至于Babel v6,Babel不再包含任何变形金刚。您必须明确{... 3}}想要转换。
最快捷的方法是使用预设,它已经包含了转换ES2015和更新提案所需的插件集。对于async
,您需要specify any feature和es2015
预设以及es2017
插件(不要忘记安装babel-runtime
,如文档中所述):
{
"presets": [
"es2015",
"es2017"
],
"plugins": [
"transform-runtime"
]
}
如果您在支持ES2015的环境(更具体地说,生成器和Promises)中运行代码,那么您只需要es2017预设:
{
"presets": [
"es2017"
]
}
要仅转换async
函数,您需要以下插件。
runtime
才能解析异步函数
为了运行异步功能,您需要使用
syntax-async-functions
:将async
函数转换为生成器。这将使用Babel自己的"共同常规"实施transform-async-to-generator
:还将async
函数转换为生成器,但将其传递给配置中指定的模块和方法,而不是Babel自己的方法。这允许您使用外部库,例如bluebird
。如果您的代码在支持生成器的环境中运行,那么就没有什么可做的了。但是,如果目标环境不支持生成器,则还必须转换生成器。这是通过transform-async-to-module-method
转换完成的。此转换取决于运行时函数,因此您还需要Babel的transform-regenerator
转换(+ 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"
]
}
是的,您必须启用transform-runtime
。 Babel使用experimental transformers。
<强>用法强>
$ babel --experimental
babel.transform("code", { experimental: true });
答案 1 :(得分:6)
自(2月25日Felix Kling)以来,这个解决方案可能已经发生了变化,或者可能还有不止一种方法可以使用异步等待。
对我们有用的是像这样运行Babel
$ npm install babel-runtime
$ babel inputES7.js -o outputES5.js --optional runtime
答案 2 :(得分:4)
我今天通过执行额外的npm install babel-preset-stage-0
并像
var babel = require("babel-core");
var transpiled = babel.transform(code, { "presets": ["stage-0"] });
见
答案 3 :(得分:2)
现在可能更新了;把babel的东西放在一个单独的文件中:
'use strict';
require('babel/register'); // Imports babel - auto transpiles the other stuff
require('./app'); // this is es6 - gets transpiled
有关详细信息,请参阅我在how-can-i-use-es2016-es7-async-await-in-my-acceptance-tests-for-a-koa-js-app的代码。
答案 4 :(得分:2)
批准的答案现在似乎已经过时了。实验标志已被弃用,有利于阶段。
http://babeljs.io/blog/2015/03/31/5.0.0/#experimental-option
<强>用法强>
$ babel --stage 0
babel.transform("code", { stage: 0 });
第0阶段
第1阶段
第2阶段(默认情况下启用第2阶段及以上)