我正在尝试在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的情况下正常使用它,效果很好。知道我做错了什么吗?


当前回答

此解决方案已过时。

我在这个视频的youtube评论中找到了解决方案https://www.youtube.com/watch?v=iWUR04B42Hc&lc=Ugyq8UJq-OyOzsKIIrB4AaABAg公司

这应该指向正确的注释。“贝丝w”找到了解决方案。

Beth W 3个月前(编辑)我在2019年不得不做的另一个改变是,babel显然不再使用v7之前的阶段0预设,所以在26:15时,我不得不做的不是“npm install--save dev babel polyfill babel-preset-stage-0”,而是:npm安装--保存@babel/polyfill这包括两个旧选项。然后,在应用程序的入口点中,我>包含了“@babel/polyfill”,并在查询预设中保持原样。因此,webpack配置最终看起来像:

const path = require('path');
module.exports = {
    entry: {
        app: ['@babel/polyfill', './src/app.js']
    },
    output: {
        path: path.resolve(__dirname, 'build'),
        filename: 'app.bundle.js'
    },
    mode: 'development',
    module: {
        rules: [{
            test: /\.js?$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            query: {
                presets: ['@babel/preset-env']
            }
        }]
    }
}

希望这对某人有所帮助!

其他回答

供将来参考:

从Babel版本7.0.0-beta.55起,已删除舞台预设

参考博客https://babeljs.io/blog/2018/07/27/removing-babels-stage-presets

异步等待仍然可以由

https://babeljs.io/docs/en/babel-plugin-transform-async-to-generator#usage

安装

npm install --save-dev @babel/plugin-transform-async-to-generator

babelrc中的用法

 { 
     "presets": ["@babel/preset-env"],
     "plugins": ["@babel/plugin-transform-async-to-generator"]
 }

并使用babel polyfillhttps://babeljs.io/docs/en/babel-polyfill

安装

npm install --save @babel/polyfill

webpack.config.js

module.exports = {
  entry: ["@babel/polyfill", "./app/js"],
};

babel再生器运行时现在已被弃用,而应该使用再生器。

要将运行时生成器与webpack和babel v7一起使用,请执行以下操作:

安装再生器运行时:

npm i -D regenerator-runtime

然后在webpack配置中添加:

entry: [
  'regenerator-runtime/runtime',
  YOUR_APP_ENTRY
]

我使用了来自https://github.com/babel/babel/issues/9849#issuecomment-592668815,并将targets:{esmodules:true,}添加到我的babel.config.js。

module.exports = {
  presets: [
    [
      '@babel/preset-env',
      {
        targets: {
          esmodules: true,
        },
      },
    ],
  ],
}

此解决方案已过时。

我在这个视频的youtube评论中找到了解决方案https://www.youtube.com/watch?v=iWUR04B42Hc&lc=Ugyq8UJq-OyOzsKIIrB4AaABAg公司

这应该指向正确的注释。“贝丝w”找到了解决方案。

Beth W 3个月前(编辑)我在2019年不得不做的另一个改变是,babel显然不再使用v7之前的阶段0预设,所以在26:15时,我不得不做的不是“npm install--save dev babel polyfill babel-preset-stage-0”,而是:npm安装--保存@babel/polyfill这包括两个旧选项。然后,在应用程序的入口点中,我>包含了“@babel/polyfill”,并在查询预设中保持原样。因此,webpack配置最终看起来像:

const path = require('path');
module.exports = {
    entry: {
        app: ['@babel/polyfill', './src/app.js']
    },
    output: {
        path: path.resolve(__dirname, 'build'),
        filename: 'app.bundle.js'
    },
    mode: 'development',
    module: {
        rules: [{
            test: /\.js?$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            query: {
                presets: ['@babel/preset-env']
            }
        }]
    }
}

希望这对某人有所帮助!

我在尝试运行Mocha+Babel时遇到了这个问题。我有一个.babelrc在开发中运行(请参阅这里的其他答案,它们很完整),但我的npm运行测试命令仍然在抱怨regeneratorRuntime没有定义。所以我修改了package.json:

"scripts": {
  "test": "mocha --require babel-polyfill --require babel-core/register tests/*.js"
}

阅读更多信息:https://babeljs.io/en/setup/#mocha-4