Регенератор Babel 6Виконання не визначено

Я намагаюся використовувати 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;

Використання його в звичайному режимі без асинхронізації/очікування працює просто чудово. Є ідеї, що я роблю не так?

loganfsmyth
Edited question 18-го липня 2017 в 9:45
Програмування
javascript node.js babeljs
4-го листопада 2015 в 4:58
2 погляди
Рішення

Потрібен 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 з 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
MegaMatt
Edited answer 25-го березня 2019 в 7:46
Коментарі (21)

Крім polyfill я використовую babel-plugin-transform-runtime. Плагін описується як:

Екстерналізувати посилання на хелпери та білдіни, автоматично поліфілюючи ваш код, не забруднюючи глобали. Але що це означає насправді? По суті, ви можете використовувати вбудовані функції, такі як Promise, Set, Symbol і т.д., а також використовувати всі функції Babel, які вимагають полізаповнення безперешкодно, без глобального забруднення, що робить його надзвичайно придатним для бібліотек.

Він також включає підтримку асинхронізації/очікування разом з іншими вбудованими функціями ES 6.

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

У .babelrc додайте плагін часу виконання

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

Примітка Якщо ви використовуєте babel 7, пакет було перейменовано на @babel/plugin-transform-runtime.

Jee Mok
Edited answer 18-го вересня 2019 в 11:24
Коментарі (13)

Крім того, якщо вам не потрібні всі модулі, які надає babel-polyfill, ви можете просто вказати babel-regenerator-runtime в конфігурації вашого webpack:

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

  // ...
};

При використанні webpack-dev-server з HMR це значно зменшує кількість файлів, які потрібно компілювати при кожній збірці. Цей модуль встановлюється як частина babel-polyfill, тому якщо у вас вже є цей модуль, то все гаразд, інакше ви можете встановити його окремо за допомогою npm i -D babel-regenerator-runtime.

Коментарі (2)