未定义RegeneratorRuntime

Question

我正在尝试运行Karma-babel-preprocessor和一个直接的ES6生成器:

//require('babel/polyfill');

  describe("how Generators work", function() {
    it("will allow generator functions", function() {
      /*function * numbers() {
        yield 1;
        yield 2;
        yield 3;
      };*/


      let numbers = {
        [Symbol.iterator]:function*(){
            yield 1;
            yield 2;
            yield 3;
          }
      }

      let sum = 0;

      for(n of numbers){
        sum += n;
      }

      expect(sum).toBe(6);
    });
  });

从这里我用babel生成了我的测试文件(ES6 => ES5):

babel src --watch --out-dir tests

然后我跑了karma start我得到错误:

ReferenceError:未定义"regeneratorRuntime".

karma.conf.js中的相关位:

  // list of files / patterns to load in the browser
    files: [
      'test-main.js',
      {pattern: 'tests/*.js', included: true}
    ],


    // list of files to exclude
    exclude: [
    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
            'src/*.js': ['babel']
    },
        'babelPreprocessor': {
      options: {
        sourceMap: 'inline'
      },
      filename: function(file) {
        return file.originalPath.replace(/\.js$/, '.es5.js');
      },
      sourceFileName: function(file) {
        return file.originalPath;
      }
    },


// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],

github上的完整项目

我能够使用许多ES6功能,包括箭头.没有继续发电机.

Answer 1

Node js Env - 2015年12月更新

这个问题已经得到解答,请查看已接受的答案,除非在NodeJS环境中运行.

如果像我一样,你有同样的错误信息:'ReferenceError:没有定义regeneratorRuntime' 但是在NodeJS环境中运行Babel,那么只需执行以下操作就可以解决您的问题:

npm install babel-polyfill --save

然后在受影响模块的顶部插入以下require语句以获取所需(生成器)行为:

require("babel-polyfill");

这应该是您所需要的,只需导入模块在运行时添加所需的polyfill行为.

Answer 2

虽然我采用了不同的方法**在我的项目中使用Karma和Babel,我怀疑你遇到了同样的问题:没有加载Babel polyfill,所以你没有得到它支持的功能(包括Babel用于使生成器工作的自定义再生器运行时).

一种方法是找到一种方法来包含polyfill,也许是通过files数组将它提供给Karma:

files: [
  'path/to/browser-polyfill.js', // edited: polyfill => browser-polyfill per P.Brian.Mackey's answer
  ...

另一种方法可能是使用Babel的运行时转换器 [ 编辑:在重新读取文档时,除非您使用browserify/webpack/etc,否则这将无效.处理require()变换器创建的调用 ]; 根据其文件,

在runtime可选的变压器做了三两件事:

• babel-runtime/regenerator使用生成器/异步功能时自动需要.
• 自动需要babel-runtime/core-js并映射ES6静态方法和内置函数.
• 删除内联babel助手并使用module babel-runtime/helpers替代.

我对此没有任何经验,但我怀疑你会通过optional: ['runtime']在babelPreprocessor配置中包含来自Babel文档的选项来实现,即:

'babelPreprocessor': {
  options: {
    optional: ['runtime'],  // per http://babeljs.io/docs/usage/options/
    sourceMap: 'inline'
  },
...

(**我现在正在使用jspm + jspm-karma +一些配置来让Babel polyfill加载到SystemJS中;询问是否相关,我会解释.)

Answer 3

与arcseldon的帖子类似,我在NodeJS环境中运行Babel并收到相同的错误消息'ReferenceError:regeneratorRuntime not defined'.虽然安装babel-polyfill确实有效,但我选择使用@ babel/plugin-transform-runtime.

@巴贝尔/插件变换的运行时

它需要以两种方式安装...首先作为dev依赖:

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

第二个是生产依赖:

npm install --save @babel/runtime

然后需要对.babelrc文件进行一个简单的添加:

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

这些添加提供了没有ReferenceError的ES6创作功能.