RegeneratorRuntime nu este definit (Programare, Javascript, Karma Runner, Babeljs, Karma Babel Preprocesor Babel)

P.Brian.Mackey a intrebat.

Încerc să execut Karma-babel-preprocessor și un generator ES6 direct:

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

De aici am generat fișierele mele de test (ES6 => ES5) cu babel:

babel src --watch --out-dir tests

Apoi am rula karma start Primesc o eroare:

ReferenceError: regeneratorRuntime nu este definit”.

Fragmente relevante în 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'],

Proiectul complet pe github

Sunt capabil să folosesc multe caracteristici ES6, inclusiv săgeți. Doar că nu merge pe Generators.

5 răspunsuri
Martin

În timp ce eu am o abordare diferită** pentru a folosi Karma cu Babel în proiectul meu, bănuiesc că ai aceeași problemă ca și mine: se pare că Babel polyfill nu este încărcat și, prin urmare, nu primiți funcționalitatea pe care o suportă (inclusiv timpul de execuție al regeneratorului personalizat pe care Babel îl folosește pentru a face să funcționeze generatoarele).

O abordare ar fi să găsiți o modalitate de a include polyfill-ul, poate prin alimentarea lui Karma prin intermediul matricei de fișiere:

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

O abordare alternativă ar putea fi utilizarea aplicației Babel’s transformator de timp de execuție [modificare: după ce am recitit documentația, acest lucru nu va funcționa decât dacă apoi browserify/webpack/etc. pentru a procesa fișierul require() apelurile create de transformator]; conform documentației sale,

runtime transformatorul opțional face trei lucruri:

  • Solicită în mod automat babel-runtime/regenerator atunci când folosiți generatoare/funcții de sincronizare.
  • Solicită automat babel-runtime/core-js și mapează metodele statice ES6 și elementele construite.
  • Îndepărtează ajutoarele babel inline și utilizează module babel-runtime/helpers în loc.

Nu am experiență în acest sens, dar bănuiesc că ați putea face acest lucru prin includerea optional: ['runtime'] din documentația Babel în documentul dvs. babelPreprocessor config, și anume:

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

(** În prezent, folosesc jspm + jspm-karma + o anumită configurație pentru ca Babel polyfill să se încarce în SystemJS; întrebați dacă este relevant și vă voi expune.)

Comentarii

  • Am încercat ambele opțiuni. Niciuna dintre ele nu a funcționat pentru mine. Am adăugat node_modules/babel/polyfill.js și Error: Uncaught ReferenceError: module is not defined. Cred că se referă la singura linie din acest fișier care conține module. Am adăugat din ce în ce mai multe directoare dir/*.js și m-am adâncit tot mai mult în el fără ca nimic să funcționeze. A doua opțiune pe care ați enumerat-o pare să nu aibă niciun impact, aceeași eroare. –  > Por P.Brian.Mackey.
  • Răspunsul tău este foarte apropiat și cu siguranță m-a pus pe drumul cel bun. Există câteva probleme, așa că am postat un răspuns care să mă ajute să le identific. –  > Por P.Brian.Mackey.
  • Minunat! Am editat calea polyfill în răspunsul meu pentru a nu-i deruta pe ceilalți. –  > Por Martin.
arcseldon

Node js Env – actualizat în decembrie 2015

Această întrebare a primit deja un răspuns, vă rugăm să consultați răspunsul acceptat, CU EXCEPȚIA executării în mediul NodeJS.

Dacă, la fel ca mine, ați avut același mesaj de eroare: ‘ReferenceError: regeneratorRuntime nu este definit’ dar rulați Babel în cadrul unui mediu NodeJS, atunci pur și simplu făcând următoarele va rezolva probabil problema:

npm install babel-polyfill --save

Apoi inserați următoarea instrucțiune require în partea de sus a modulului afectat pentru a obține comportamentul necesar (generator):

require("babel-polyfill");

Acest lucru ar trebui să fie tot ceea ce aveți nevoie, doar importul modulului adaugă comportamentul polifill necesar în timpul execuției.

Comentarii

  • Am încercat să obțin FuseBox să funcționeze pentru a grupa o aplicație React și a trebuit să fac acest lucru pentru a funcționa corect. –  > Por OtotheA.
Kevin

Similar cu postarea lui arcseldon, am rulat Babel într-un mediu NodeJS și am primit același mesaj de eroare „ReferenceError: regeneratorRuntime is not defined”. În timp ce instalarea babel-polyfill funcționează, am mers cu @babel/plugin-transform-runtime în schimb.

@babel/plugin-transform-runtime

Acesta trebuie instalat în două moduri … mai întâi ca dependență dev:

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

și în al doilea rând ca dependență de producție:

npm install --save @babel/runtime

Și apoi trebuie să se facă o simplă adăugare la fișierul .babelrc:

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

Aceste adăugiri oferă funcționalitatea de creare ES6 fără ReferenceError.

Comentarii

  • Am încercat să fac ca unele teste unitare Jest să ruleze corect pe circleci și a trebuit să folosesc acest lucru pentru a le face să treacă. –  > Por Arnaud Valle.
P.Brian.Mackey

Am modificat karma.conf.js pentru a adăuga browser-polyfill ca menționat în linkul Docs:

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

După această modificare, următorul test unitar funcționează în 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);
    });
  });

Comentarii

  • Cum arată întregul fișier karma.conf? –  > Por JerryFox.
Rafal Enden

Dacă folosiți React, adăugarea de polyfill-uri din create-react-app a funcționat pentru mine.

yarn add --dev react-app-polyfill

Apoi adăugați următoarele linii la webpack.config.js

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

Vedeți mai multe exemple pe pagina de internet react-app-polyfill pagina GitHub de pe react-app-polyfill.