我无法正确设置babel以使用async / await。
我正在使用babel 7和webpack 4。
如果可能,我不想使用babel-polyfill!
我的babelrc文件:
{
"presets": [[
"@babel/env",
{"modules": false}
]],
"plugins": [
"syntax-dynamic-import",
"transform-async-to-generator"
]
}
代码:
async function init() {
const loaderData = await initLoader();
initCmp(loaderData)
.then(initApi(loaderData.key))
.catch();
}
init();
错误:
refactor.main.js:18 Uncaught ReferenceError: regeneratorRuntime is not defined
at eval (refactor.main.js:18)
at eval (refactor.main.js:47)
at Object../client/refactor.main.js (cmp.bundle.js:312)
at __webpack_require__ (cmp.bundle.js:62)
at eval (main.js:6)
at Object../client/main.js (cmp.bundle.js:300)
at __webpack_require__ (cmp.bundle.js:62)
at cmp.bundle.js:179
at cmp.bundle.js:182
答案 0 :(得分:18)
这里的最新文档非常清楚: https://babeljs.io/docs/en/next/babel-plugin-transform-runtime
对我有用的是安装两个用于构建和运行时的软件包(浏览器的最终脚本):
npm install --save-dev @babel/plugin-transform-runtime
npm install --save @babel/runtime
在我的webpack配置的插件数组中,我只是添加了'@ babel / plugin-transform-runtime',没有任何选择。 (也请查看上面链接的文档,因为某些选项(您可能会在较早的教程或答案中找到)已被删除。)
plugins: [
'@babel/plugin-transform-runtime'
]
我现在可以使用异步函数而不会出现错误,并且它不会在生产版本中添加太多代码。
答案 1 :(得分:2)
您还需要transform-runtime
插件,因此您的.babelrc应该准备就绪:
{
"presets": [[
"@babel/env",
{"modules": false}
]],
"plugins": [
"syntax-dynamic-import",
"transform-runtime",
"transform-async-to-generator"
]
}
请注意,您还需要npm install --save-dev transform-runtime