web-dev-qa-db-fra.com

RegeneratorRuntime n'est pas défini

J'essaie d'exécuter Karma-babel-preprocessor et un générateur ES6 simple:

//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);
    });
  });

À partir de cela, j'ai généré mes fichiers de test (ES6 => ES5) avec babel:

babel src --watch --out-dir tests

Ensuite, je lance karma start J'obtiens une erreur:

ReferenceError: régénérateurRuntime n'est pas défini ".

Bits pertinents dans 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'],

Projet complet sur github

Je peux utiliser de nombreuses fonctionnalités ES6, y compris des flèches. Pas question de générateurs.

javascriptkarma-runnerbabeljskarma-babel-preprocessor
31
P.Brian.Mackey

Bien que j'utilise une approche différente ** pour utiliser Karma avec Babel dans mon projet, je soupçonne que vous rencontrez le même problème que moi: le Babel polyfill n'est pas en cours de chargement, et donc vous ' ne pas obtenir les fonctionnalités qu'il prend en charge (y compris le runtime de régénérateur personnalisé que Babel utilise pour faire fonctionner les générateurs).

Une approche serait de trouver un moyen d'inclure le polyfill, peut-être en le nourrissant dans Karma via le tableau de fichiers:

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

Une autre approche peut consister à utiliser l'édition Babel runtime transformer [: lors de la relecture des documents, cela ne fonctionnera que si vous naviguez ensuite/webpack/etc. pour traiter les appels require() créés par le transformateur ]; par ses documents,

Le transformateur facultatif runtime fait trois choses:

  • Nécessite automatiquement babel-runtime/regenerator Lorsque vous utilisez des générateurs/fonctions asynchrones.
  • Nécessite automatiquement babel-runtime/core-js Et mappe les méthodes statiques et intégrées ES6.
  • Supprime les assistants babel en ligne et utilise le module babel-runtime/helpers À la place.

Je n'ai aucune expérience avec cela, mais je soupçonne que vous le feriez en incluant l'option optional: ['runtime'] Des documents Babel dans votre babelPreprocessor config, à savoir:

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

( ** J'utilise actuellement jspm + jspm-karma + quelques config pour obtenir le polyfill Babel à charger dans SystemJS; demandez si pertinent et je vais exposer. )

25
Martin

Node js Env - mis à jour en décembre 2015

Cette question a déjà été répondue, veuillez consulter la réponse acceptée À MOINS D'exécuter dans l'environnement NodeJS.

Si comme moi, vous aviez le même message d'erreur: 'ReferenceError: régénérateurRuntime n'est pas défini' mais exécutiez Babel dans un environnement NodeJS, alors simplement faire ce qui suit résoudra probablement votre problème:

npm install babel-polyfill --save

Insérez ensuite l'instruction require suivante vers le haut du module affecté pour obtenir le comportement (générateur) requis:

require("babel-polyfill");

Cela devrait être tout ce dont vous avez besoin, le simple fait d'importer le module ajoute le comportement polyfill requis lors de l'exécution.

41
arcseldon

Semblable à l'article d'Arcseldon, j'exécutais Babel dans un environnement NodeJS et recevais le même message d'erreur "ReferenceError: régénérateurRuntime n'est pas défini". Bien que l'installation de babel-polyfill fonctionne, j'ai opté pour @ babel/plugin-transform-runtime à la place.

@ babel/plugin-transform-runtime

Il doit être installé de deux manières ... d'abord en tant que dépendance de développement:

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

et deuxièmement en tant que dépendance de production:

npm install --save @babel/runtime

Et puis il doit y avoir un simple ajout à votre fichier .babelrc:

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

Ces ajouts donnent la fonctionnalité de création d'ES6 sans ReferenceError.

19
Kevin

J'ai modifié karma.conf.js ajouter browser-polyfill comme mentionné dans le Docs Link :

files: [
            'node_modules/babel/browser-polyfill.js',
      'test-main.js',
      {pattern: 'tests/*.js', included: true}
    ],

Après cette modification, le test unitaire suivant fonctionne dans Karma:

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

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

      let sum = 0;

      for(let num of numbers){
        sum += num;
      }

      expect(sum).toBe(6);
    });
  });
4
P.Brian.Mackey

Si vous utilisez React , en ajoutant des polyfills à partir de create-react-app a fonctionné pour moi.

yarn add --dev react-app-polyfill

Ajoutez ensuite les lignes suivantes à webpack.config.js

entry: {
  app: [
    'react-app-polyfill/ie9', // Only if you want to support IE 9
    'react-app-polyfill/stable',
    './src/index.jsx',
  ],
},

Voir plus d'exemples sur la page GitHub react-app-polyfill .

0
Rafal Enden