更新

Question

我正在尝试使用async，从头开始等待Babel 6，但我没有定义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的情况下正常使用它可以正常工作。我有什么想法吗？

Answer 1

babel-polyfill是必需的。您还必须安装它才能使异步/等待工作。

npm i -D babel-core babel-polyfill babel-preset-es2015 babel-preset-stage-0 babel-loader

的package.json

"devDependencies": {
  "babel-core": "^6.0.20",
  "babel-polyfill": "^6.0.16",
  "babel-preset-es2015": "^6.0.15",
  "babel-preset-stage-0": "^6.0.15"
}

.babelrc

{
  "presets": [ "es2015", "stage-0" ]
}

.js with async / await（示例代码）

"use strict";

export default async function foo() {
  var s = await bar();
  console.log(s);
}

function bar() {
  return "bar";
}

在启动文件中

require("babel-core/register");
require("babel-polyfill");

如果您使用 webpack ，则需要将其作为entry数组的第一个值放在您的webpack配置文件中（通常为webpack.config.js），如@Cemen评价：

module.exports = {
  entry: ['babel-polyfill', './test.js'],

  output: {
    filename: 'bundle.js'       
  },

  module: {
    loaders: [
      { test: /\.jsx?$/, loader: 'babel', }
    ]
  }
};

如果您想使用babel运行测试，请使用：

mocha --compilers js:babel-core/register --require babel-polyfill

Answer 2

除了polyfill，我使用babel-plugin-transform-runtime。该插件描述为：

外部化对助手和内置函数的引用，自动填充代码而不会污染全局变量。这究竟意味着什么？基本上，您可以使用Promise，Set，Symbol等内置函数，以及使用所有需要无缝填充的Babel功能，而不会造成全局污染，使其非常适合图书馆。

它还包括对async / await以及ES 6的其他内置函数的支持。

$ npm install --save-dev babel-plugin-transform-runtime

在.babelrc中，添加运行时插件

{
  "plugins": [
    ["transform-runtime", {
      "polyfill": false,
      "regenerator": true
    }]
  ]
}

Answer 3

更新

如果您将目标设置为Chrome，则此功能正常。但它可能不适用于其他目标，请参阅：https://github.com/babel/babel-preset-env/issues/112

因此，对于原始问题，这个答案 NOT 非常合适。我将此处作为对babel-preset-env的参考。

一个简单的解决方案是在代码的开头添加import 'babel-polyfill'。

如果您使用webpack，快速解决方案是添加babel-polyfill，如下所示：

entry: {
    index: ['babel-polyfill', './index.js']
}

我相信我找到了最新的最佳做法。

检查此项目：https://github.com/babel/babel-preset-env

yarn add --dev babel-preset-env

使用以下内容作为您的babel配置：

{
  "presets": [
    ["env", {
      "targets": {
        "browsers": ["last 2 Chrome versions"]
      }
    }]
  ]
}

然后，您的应用应该可以使用最新版本的Chrome浏览器。

您还可以将节点设置为目标，或根据https://github.com/ai/browserslist

微调浏览器列表

告诉我什么，不要告诉我怎么做。

我非常喜欢babel-preset-env的哲学：告诉我你想支持哪个环境，不要告诉我如何支持它们。这是声明性编程的美妙之处。

我已经对async await进行了测试，但他们确实有效。我不知道他们是如何工作的，我真的不想知道。我想把时间花在我自己的代码和业务逻辑上。感谢babel-preset-env，它将我从Babel配置中解放出来。

Answer 4

Babel 7用户

我遇到了一些麻烦，因为大多数信息都针对先前的babel版本。对于Babel 7，请安装以下两个依赖项：

npm install --save @babel/runtime 
npm install --save-dev @babel/plugin-transform-runtime

然后在.babelrc中添加：

{
    "presets": ["@babel/preset-env"],
    "plugins": [
        ["@babel/transform-runtime"]
    ]
}

Answer 5

或者，如果您不需要babel-polyfill提供的所有模块，您只需在webpack配置中指定babel-regenerator-runtime：

module.exports = {
  entry: ['babel-regenerator-runtime', './test.js'],

  // ...
};

当使用带有HMR的webpack-dev-server时，这样做可以减少每次构建时必须编译的文件数量。此模块是作为babel-polyfill的一部分安装的，所以如果您已经拥有它，那么您可以使用npm i -D babel-regenerator-runtime单独安装。

Answer 6

我的简单解决方案：

npm install --save-dev babel-plugin-transform-runtime
npm install --save-dev babel-plugin-transform-async-to-generator

<强> .babelrc

{
  "presets": [
    ["latest", {
      "es2015": {
        "loose": true
      }
    }],
    "react",
    "stage-0"
  ],
  "plugins": [
    "transform-runtime",
    "transform-async-to-generator"
  ]
}

Answer 7

在没有适当的Babel插件的情况下使用async/await函数会导致此错误。截至2020年3月，您需要做的只是以下工作。（{@babel/polyfill和很多公认的解决方案在Babel中已被弃用。在Babel docs.中了解更多信息）

在命令行中，输入：

npm install --save-dev @babel/plugin-transform-runtime

在您的babel.config.js文件中，添加此插件@babel/plugin-transform-runtime。注意：以下示例包含了我最近从事的一个小型React / Node / Express项目所具有的其他预设和插件：

module.exports = {
  presets: ['@babel/preset-react', '@babel/preset-env'],
  plugins: ['@babel/plugin-proposal-class-properties', 
  '@babel/plugin-transform-runtime'],
};

Answer 8

babel-regenerator-runtime现在是deprecated，而应该使用regenerator-runtime。

将运行时生成器与webpack和babel v7：

一起使用

安装regenerator-runtime：

npm i -D regenerator-runtime

然后在webpack配置中添加：

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

Answer 9

小心提升的功能

我在同一个文件中同时使用了'polyfill import'和'async function'，但是我使用的函数语法将它提升到polyfill上方，这会给我ReferenceError: regeneratorRuntime is not defined错误。

更改此代码

import "babel-polyfill"
async function myFunc(){ }

到此

import "babel-polyfill"
var myFunc = async function(){}

以防止它在polyfill导入上方悬挂。

Answer 10

如果使用babel-preset-stage-2，则只需使用--require babel-polyfill启动脚本。

在我的情况下，Mocha测试引发了此错误。

修复了问题

mocha \"server/tests/**/*.test.js\" --compilers js:babel-register --require babel-polyfill

Answer 11

我将项目转换为打字稿项目后开始出现此错误。根据我的理解，问题源于异步/等待不被识别。

对我来说，错误是通过在我的设置中添加两件事来解决的：

如上所述，我需要将babel-polyfill添加到我的webpack条目数组中：
```
...

entry: ['babel-polyfill', './index.js'],

...
```
我需要更新我的.babelrc以允许将async / await枚举到生成器中：
```
{
  "presets": ["es2015"],
  "plugins": ["transform-async-to-generator"]
}
```

DevDependencies：

我还必须在package.json文件中的devDependencies中安装一些东西。也就是说，我错过了babel-plugin-transform-async-to-generator，babel-polyfill和babel-preset-es2015：

 "devDependencies": {
    "babel-loader": "^6.2.2",
    "babel-plugin-transform-async-to-generator": "^6.5.0",
    "babel-polyfill": "^6.5.0",
    "babel-preset-es2015": "^6.5.0",
    "webpack": "^1.12.13"
 }

完整代码要点：

我从一个非常有用且简洁的GitHub要点中找到了代码，你可以找到here。

Answer 12

根据以下示例更新您的implementation 'com.google.android.gms:play-services-maps:16.0.0'文件，它将起作用。

如果您使用的是.babelrc软件包

@babel/preset-env

Answer 13

截至2019年10月，这对我有用：

将此添加到预设。

 "presets": [
      "@babel/preset-env"
    ]

然后使用npm安装regenerator-runtime。

npm i regenerator-runtime

然后在您的主文件中使用：（此导入仅使用一次）

import "regenerator-runtime/runtime";

这将使您能够在文件中使用async awaits并删除regenerator error

Answer 14

您收到错误是因为async / await使用的是生成器，这是ES2016的功能，而不是ES2015。解决此问题的一种方法是安装ES2016（npm install --save babel-preset-es2016）的babel预设并编译为ES2016而不是ES2015：

"presets": [
  "es2016",
  // etc...
]

正如其他答案所提到的，您也可以使用polyfills（尽管在运行任何其他代码之前请确保load the polyfill first）。或者，如果您不想包含所有填充依赖项，则可以使用babel-regenerator-runtime或babel-plugin-transform-runtime。

Answer 15

我通过安装babel-polyfill

修复了这个错误

npm install babel-polyfill --save

然后我在我的app入口点导入了它

import http from 'http';
import config from 'dotenv';
import 'babel-polyfill';
import { register } from 'babel-core';
import app from '../app';

用于测试我包括 - 在我的测试脚本中查询babel-polyfill

"test": "export NODE_ENV=test|| SET NODE_ENV=test&& mocha --compilers 
  js:babel-core/register --require babel-polyfill server/test/**.js --exit"

Answer 16

我需要支持的目标浏览器已经支持异步/等待，但是在编写摩卡测试时，如果没有适当的设置，我仍然会遇到此错误。

我搜索过的大多数文章都已过时，包括此处接受的答案和投票率很高的答案，即您不需要polyfill，babel-regenerator-runtime，babel-plugin-transform-runtime。等等。如果您的目标浏览器已经支持异步/等待（当然，如果您不需要polyfill）

我也不想使用webpack。

泰勒·朗（Tyler Long）的答案实际上是正确的，因为他建议了babel-preset-env（但是我首先省略了答案，因为他一开始就提到polifill）。一开始我仍然得到ReferenceError: regeneratorRuntime is not defined，然后我才意识到这是因为我没有设定目标。为节点设置目标后，我修复了regeneratorRuntime错误：

  "scripts": {
    //"test": "mocha --compilers js:babel-core/register"
    //https://github.com/mochajs/mocha/wiki/compilers-deprecation
    "test": "mocha --require babel-core/register"
  },
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-preset-env": "^1.7.0",
    "mocha": "^5.2.0"
  },
  //better to set it .bablerc, I list it here for brevity and it works too.
  "babel": {
    "presets": [
      ["env",{
        "targets": {
          "node": "current"
           "chrome": 66,
           "firefox": 60,
        },
        "debug":true
      }]
    ]
  }

Answer 17

新答案为什么要按照我的回答？

Ans：因为我打算用最新的更新版本npm项目给你答案。

<强> 2017年4月14日

"name": "es6",
 "version": "1.0.0",
   "babel-core": "^6.24.1",
    "babel-loader": "^6.4.1",
    "babel-polyfill": "^6.23.0",
    "babel-preset-es2015": "^6.24.1",
    "webpack": "^2.3.3",
    "webpack-dev-server": "^2.4.2"

如果您使用此版本或更高版本的Npm以及所有其他... 所以只需要改变：

<强> webpack.config.js

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

更改webpack.config.js文件后，只需将此行添加到代码顶部即可。

import "babel-polyfill";

现在检查一切正常。 Reference LINK

还要感谢@BrunoLM，感谢他的回答。

Answer 18

致babel7用户和ParcelJS> = 1.10.0用户

npm i @babel/runtime-corejs2
npm i --save-dev @babel/plugin-transform-runtime @babel/core

.babelrc

{
  "plugins": [
    ["@babel/plugin-transform-runtime", {
      "corejs": 2
    }]
  ]
}

取自https://github.com/parcel-bundler/parcel/issues/1762

Answer 19

1 - 安装babel-plugin-transform-async-to-module-method， babel-polyfil，bluebird，babel-preset-es2015，babel-core：

npm install babel-plugin-transform-async-to-module-method babel-polyfill bluebird babel-preset-es2015 babel-core

2 - 添加你的js babel polyfill：

import 'babel-polyfill';

3 - 在.babelrc中添加插件：

{
    "presets": ["es2015"],
    "plugins": [
      ["transform-async-to-module-method", {
        "module": "bluebird",
        "method": "coroutine"
      }]
    ]
}

来源：http://babeljs.io/docs/plugins/transform-async-to-module-method/

Answer 20

我在Chrome中遇到了这个问题。类似于RienNeVaPlu的回答，这为我解决了这个问题：

npm install --save-dev regenerator-runtime

然后在我的代码中：

import 'regenerator-runtime/runtime';

很高兴避免从babel-polyfill那里获得额外的200 kB。

Answer 21

在控制台中解决此“ regeneratorRuntime未定义问题”的最简单方法：

您不必安装任何不必要的插件。只需添加：

<script src="https://unpkg.com/regenerator-runtime@0.13.1/runtime.js"></script>

位于index.html正文的内部。现在，一旦运行babel，就应该定义regeneratorRuntime，并且应该将async / await函数成功编译到ES2015中。

Answer 22

对于希望使用babel-polyfill版本7的用户，请使用webpack ver3 ^进行此操作。

Npm安装模块npm i -D @babel/polyfill

然后在webpack点的entry文件中执行此操作

entry: ['@babel/polyfill', path.resolve(APP_DIR, 'App.js')],

Answer 23

在2019年，使用Babel 7.4.0+的{{1}}软件包已被弃用，转而直接包含babel-polyfill（core-js/stable，以填充ECMAScript功能）和core-js@3+（需要使用编译器生成器函数）：

regenerator-runtime/runtime

来自import "core-js/stable"; import "regenerator-runtime/runtime"; documentation的信息。

Answer 24

当我尝试使用ES6生成器时，我使用gulp with rollup得到此错误：

gulp.task('scripts', () => {
  return rollup({
    entry: './app/scripts/main.js',
    format: "iife",
    sourceMap: true,
    plugins: [babel({
      exclude: 'node_modules/**',
      "presets": [
        [
          "es2015-rollup"
        ]
      ],
      "plugins": [
        "external-helpers"
      ]
    }),
    includePaths({
      include: {},
      paths: ['./app/scripts'],
      external: [],
      extensions: ['.js']
    })]
  })

  .pipe(source('app.js'))
  .pipe(buffer())
  .pipe(sourcemaps.init({
    loadMaps: true
  }))
  .pipe(sourcemaps.write('.'))
  .pipe(gulp.dest('.tmp/scripts'))
  .pipe(reload({ stream: true }));
});

我可能认为解决方案是将babel-polyfill包括为bower组件：

bower install babel-polyfill --save

并将其添加为index.html中的依赖项：

<script src="/bower_components/babel-polyfill/browser-polyfill.js"></script>

Answer 25

我有一个设置
webpack 使用Error at C:/path/to/notify.component.ngfactory.ts:113:41: Property 'visible' is private and only accessible within class 'NotifyComponent' ... (many more like that with lots of properties from lots of components) Compilation failed
以及正在运行webpack编译的测试的 mocha 。

要使我的presets: ['es2015', 'stage-0']测试工作正常，我只需要添加async/await选项。

Answer 26

此解决方案已过时。

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

这应该指向正确的注释。为了找到解决方案，很多人“向w撒谎”。

Beth W 3个月前（已编辑）
  我必须在2019年进行的另一项更改-babel显然不再使用v7以来的stage-0预设，因此在26:15而不是'npm install --save-dev babel-polyfill babel-preset-stage-0'，我必须做：

df_list %>% map_at(c("survey08", "survey09"), ~ filter(.x, year %in% 2008:2009)) %>% map_at(c("survey08", "survey09"), ~ .x %>% mutate_at(vars(employed), ~ recode_factor(.,`1` = "yes", `2` = "no"))) $`survey08` year employed 1 2008 yes 2 2008 no 3 2008 no 4 2008 yes 5 2008 no $survey09 year employed 1 2009 yes 2 2009 yes 3 2009 yes 4 2009 no 5 2009 yes $survey10 year employed 1 2010 2 2 2010 1 3 2010 1 4 2010 1 5 2010 1

涵盖了两个较早的选项。然后，在应用程序的入口点，我>包括“ @ babel / polyfill”，在查询预置中，我将其保持不变。因此，webpack配置最终看起来像：

npm install --save @babel/polyfill

希望对某人有帮助！

Answer 27

只需安装regenerator-runtime 使用以下命令

npm i regenerator-runtime

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

require("regenerator-runtime/runtime");

到目前为止，这对我来说一直有效

Answer 28

供以后参考：

从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 polyfill https://babeljs.io/docs/en/babel-polyfill

安装

npm install --save @babel/polyfill

webpack.config.js

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

Answer 29

那里有很多答案，我将发布答案以供参考。我使用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
          }
        }
      },
    ],
  },

};

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

Answer 30

Babel 7.4.0，core-js 3

截至Babel 7.4.0，@babel/polyfill is deprecated。

通常，有两种安装polyfills / regenerator的方法：通过全局名称空间（选项1）或作为ponyfill（选项2，无全局污染）。

选项1： @babel/preset-env

presets: [
  ["@babel/preset-env", {
    useBuiltIns: "usage",
    corejs: 3, // or 2,
    targets: {
        firefox: "64", // or whatever target to choose .    
    },
  }]
]

将根据您的target自动使用regenerator-runtime和core-js。无需手动导入任何内容。不要忘记安装运行时依赖项：

npm i --save regenerator-runtime core-js

或者，设置useBuiltIns: "entry"并手动将其导入：

import "regenerator-runtime/runtime";
import "core-js/stable"; // if polyfills are also needed

选项2： @babel/transform-runtime与@babel/runtime（无全球范围污染）

{
  "plugins": [
    [
      "@babel/plugin-transform-runtime",
      {
        "regenerator": true,
        corejs: 3 // or 2; if polyfills needed
        ...
      }
    ]
  ]
}

安装：

npm i -D @babel/plugin-transform-runtime
npm i @babel/runtime

如果您使用core-js polyfills，则改为安装@babel/runtime-corejs2或@babel/runtime-corejs3，请参见here。

欢呼

修复了丢失的逗号，最小编辑为6个字符的问题

Answer 31

我正在工作的 babel 7 样板，用于与再生器运行时反应：

.babelrc

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": {
          "node": true,
        },
      },
    ],
    "@babel/preset-react",
  ],
  "plugins": [
    "@babel/plugin-syntax-class-properties",
    "@babel/plugin-proposal-class-properties"
  ]
}

package.json

...

"devDependencies": {
  "@babel/core": "^7.0.0-0",
  "@babel/plugin-proposal-class-properties": "^7.4.4",
  "@babel/plugin-syntax-class-properties": "^7.2.0",
  "@babel/polyfill": "^7.4.4",
  "@babel/preset-env": "^7.4.5",
  "@babel/preset-react": "^7.0.0",
  "babel-eslint": "^10.0.1",
...

main.js

import "@babel/polyfill";

....

Answer 32

如果要构建应用程序，则只需要@babel/preset-env和@babel/polyfill：

npm i -D @babel/preset-env
npm i @babel/polyfill

（注意：您不需要安装core-js和regenerator-runtime软件包，因为它们都将由@ babel / polyfill安装）

然后在.babelrc中输入

：

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "entry"  // this is the key. use 'usage' for further codesize reduction, but it's still 'experimental'
      }
    ]
  ]
}

现在设置目标环境。在这里，我们在.browserslistrc文件中进行操作：

# Browsers that we support

>0.2%
not dead
not ie <= 11
not op_mini all

最后，如果您使用useBuiltIns: "entry"，请将import @babel/polyfill放在条目文件的顶部。否则，您就完成了。

使用此方法将有选择地导入那些polyfill和'regenerator-runtime'文件（在此处修复您的regeneratorRuntime is not defined问题）仅（如果您的任何目标环境/浏览器需要它们）

Answer 33

安装 @babel-polyfill 并将其保存在您的开发依赖项中

npm install --save-dev @babel/polyfill

将 require("@babel/polyfill"); 复制并粘贴到您的条目文件的顶部

Entry.js

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

在入口数组中添加@babel/polyfill
您需要在预设数组中使用预设环境

webpack.config.js

const path =  require('path');
require("@babel/polyfill"); // necesarry

module.exports = {
  entry: ['@babel/polyfill','./src/js/index.js'],
  output: {
    path: path.resolve(__dirname, 'to_be_deployed/js'),
    filename: 'main.js'
  },
  module: {
    rules: [
      {
        test: /\.m?js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ['@babel/preset-env']
          }
        }
      }
    ]
  },

  mode: 'development'
}

Answer 34

这些答案中的大多数建议使用WebPack处理此错误的解决方案。但是如果有人正在使用RollUp（就像我一样），这里最终适用于我（只是一个单挑并捆绑这个polyfill广告大约10k tot输出大小）：

.babelrc

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

rollup.config.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()

    ]
};

Answer 35

如果您使用Gulp + Babel作为前端，则需要使用babel-polyfill

npm install babel-polyfill

然后在所有其他脚本标记之上添加一个脚本标记到index.html，并从node_modules

引用babel-polyfill

Answer 36

或者，如果您不使用像webpack或汇总这样的捆绑器，则可以使用index.html中的旧脚本标记导入https://raw.githubusercontent.com/facebook/regenerator/master/packages/regenerator-runtime/runtime.js的内容作为解决方法。

不是最佳选择，但就我而言，这是唯一的解决方案。

Answer 37

安装 babel-polyfill npm install --save @babel/polyfill
更新 webpack 文件 entry: ["@babel/polyfill", "<your enter js file>"]

Answer 38

只需安装：

lowEight

并将其添加到Babel的插件数组中。

Answer 39

如果您正在使用下一个 js，请将 import regeneratorRuntime from "regenerator-runtime"; 添加到引发错误的文件中，对我来说，该文件是 _document.js。

并添加

[
  "@babel/plugin-transform-regenerator",
  {
    "asyncGenerators": false,
    "generators": false,
    "async": false
  }
]

在 plugins 中，在 .babelrc 文件中。

Answer 40

在反应预设之前使用阶段2预设对我有帮助：

npx babel --watch src --out-dir . --presets stage-2,react

上面的代码在安装以下模块时有效：

npm install babel-cli babel-core babel-preset-react babel-preset-stage-2 --save-dev

Answer 41

我正在使用React和Django项目，并通过使用regenerator-runtime使它工作。您应该这样做是因为@babel/polyfill会进一步增加应用程序的大小，并且也是deprecated。我还按照this tutorial's第1和2集来创建项目的structure。

*package.json*

...
"devDependencies": {
    "regenerator-runtime": "^0.13.3",
    ...
}

.babelrc

{
   "presets": ["@babel/preset-env", "@babel/preset-react"],
   "plugins": ["transform-class-properties"]
}

index.js

...
import regeneratorRuntime from "regenerator-runtime";
import "regenerator-runtime/runtime";
ReactDOM.render(<App />, document.getElementById('app'));
...

Answer 42

在尝试运行Mocha + Babel时遇到此问题。我有一个.babelrc从事开发工作（请参阅此处的其他答案，它们很完整），但是我的npm run test命令仍在抱怨regeneratorRuntime is not defined。所以我修改了package.json：

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

了解更多： https://babeljs.io/en/setup/#mocha-4

Answer 43

我有regeneratorRuntime未定义错误当我在我的React应用中使用'async'和'await'时 “ async”和“ await”是 ES7 中的新关键字为此，您应该使用babel-preset-es2017 安装此devDependencies：

`

"babel-preset-es2017": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1", `

并使用

"presets": [ "es2017" , "stage-0" , "react" ]

Answer 44

在使用babelHelpers.js和babel.buildExternalHelpers()创建自定义babel-plugin-external-helpsers文件的情况下，我认为对客户端而言，最便宜的解决方案是在输出中添加regenerator-runtime/runtime.js而不是所有的polyfills。

// 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时，此解决方案的大小约为230 KB，而不是约20 KB。

Answer 45

我有异步等待使用webpack / babel build：

"devDependencies": {
    "babel-preset-stage-3": "^6.11.0"
}

.babelrc：

"presets": ["es2015", "stage-3"]

未定义Babel 6 regeneratorRuntime

45 个答案:

更新

我相信我找到了最新的最佳做法。

告诉我什么，不要告诉我怎么做。

小心提升的功能

更改此代码

到此

DevDependencies：

完整代码要点：

Babel 7.4.0，core-js 3