未定义Babel 6再生器运行时

我正在尝试在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 polyfill并将其保存在开发依赖项中

npm安装--保存dev@babel/polyfill

复制和粘贴需要（“@babel/polyfill”）；在输入文件的顶部

入口.js

require("@babel/polyfill"); // this should be include at the top

在条目数组中添加@babel/polyfill您需要在预设数组中预设env

webpack.config.js

常量路径=require（'path'）；要求（“@babel/polyfill”）；//必要的，必要的模块导出={条目：['@babel/polyfill'，'./src/js/index.js']，输出：{路径：路径.解析（__dirname，'to_be_deployed/js'），文件名：'main.js'},模块：{规则：[{测试：/\.m？js$/，exclude：/node_modules/，使用：{loader：“babel loader”，选项：{预设：['@babel/preset-env']}}}]},mode：'开发'}

2020-12-29 20:23:02

其他回答

上面有这么多答案，我会把我的答案贴出来供参考。我使用webpack并做出反应，这是我没有.babelrc文件的解决方案

我将于2020年8月对此进行研究

安装react和babel

npm i @babel/core babel-loader @babel/preset-env @babel/preset-react react react-dom @babel/plugin-transform-runtime --save-dev

然后在我的webpack.config.js中

// other stuff
module.exports = {
// other stuff

   module: {
   rules: [
  
   {
    test: /\.m?js$/,
    exclude: /(node_modules|bower_components)/,
    use: {
      loader: 'babel-loader',
      options: {
        presets: ['@babel/preset-env',"@babel/preset-react"],
        plugins: ['@babel/plugin-proposal-class-properties', '@babel/plugin-transform-runtime'],
        //npm install --save-dev @babel/plugin-transform-runtime
          }
        }
      },
    ],
  },

};

我只是不知道为什么我现在不需要安装异步包

2020-08-25 06:19:26

我有一个设置使用预设的webpack：['es2015'，'stage-0']以及运行webpack编译的测试的mocha。

为了使测试中的异步/等待工作，我只需要使用mocha和--require-babel polyfill选项：

mocha --require babel-polyfill

2016-09-07 20:40:28

只需安装再生器运行时具有以下命令

npm i regenerator-runtime

在需要服务器文件之前，在启动文件中添加以下行

require("regenerator-runtime/runtime");

到目前为止，这对我很有效

2020-11-10 13:52:01

这些答案中的大多数都推荐了使用WebPack处理此错误的解决方案。但如果有人在使用RollUp（就像我一样），以下是最终对我有效的方法（只需一个提示，将这个polyfill广告捆绑在一起，总输出大小约为10k）：

巴氏合金

{
    "presets": [
        [
            "env",
            {
                "modules": false,
                "targets": {
                    "browsers": ["last 2 versions"]
                }
            }
        ]
    ],
    "plugins": ["external-helpers",
        [
            "transform-runtime",
            {
                "polyfill": false,
                "regenerator": true
            }
        ]]
}

汇总配置.js

import resolve from 'rollup-plugin-node-resolve';
import babel from 'rollup-plugin-babel';
import uglify from 'rollup-plugin-uglify';
import commonjs from 'rollup-plugin-commonjs';


export default {
    input: 'src/entry.js',
    output: {
        file: 'dist/bundle.js',
        format: 'umd',
        name: 'MyCoolLib',
        exports: 'named'
    },
    sourcemap: true,
    plugins: [
        commonjs({
            // polyfill async/await
            'node_modules/babel-runtime/helpers/asyncToGenerator.js': ['default']
        }),
        resolve(),
        babel({
            runtimeHelpers: true,
            exclude: 'node_modules/**', // only transpile our source code
        }),
        uglify()

    ]
};

2017-12-24 06:56:00