我正在尝试在Babel 6上从头开始使用async/await,但我得到的是regeneratorRuntime没有定义。
.babelrc文件
{
"presets": [ "es2015", "stage-0" ]
}
package.json文件
"devDependencies": {
"babel-core": "^6.0.20",
"babel-preset-es2015": "^6.0.15",
"babel-preset-stage-0": "^6.0.15"
}
.js文件
"use strict";
async function foo() {
await bar();
}
function bar() { }
exports.default = foo;
在没有async/await的情况下正常使用它,效果很好。知道我做错了什么吗?
在一个使用babel.buildExternalHelpers()和babel插件外部帮助程序创建自定义babelHelpers.js文件的场景中,我认为对客户端来说成本最低的解决方案是将再生器runtime/runtime.js添加到输出中,而不是添加所有polyfill。
// runtime.js
npm install --save regenerator-runtime
// building the custom babelHelper.js
fs.writeFile(
'./babelHelpers.js',
fs.readFileSync('node_modules/regenerator-runtime/runtime.js')
+ '\n'
+ require('babel-core').buildExternalHelpers()
)
当包含babel polyfill时,此解决方案减少到约20KB,而不是约230KB。
当在没有正确的Babel插件的情况下使用异步/等待函数时,会导致此错误。截至2020年3月,以下应该是您需要做的全部工作
在命令行中,键入:
npm install --save-dev @babel/plugin-transform-runtime
在您的babel.config.js文件中,添加这个插件@babel/plugin-transform运行时。注意:下面的示例包括我最近为一个小型React/Node/Express项目所做的其他预设和插件:
module.exports = {
presets: ['@babel/preset-react', '@babel/preset-env'],
plugins: ['@babel/plugin-proposal-class-properties',
'@babel/plugin-transform-runtime'],
};