Am'm încercarea de a utiliza asincron, așteaptă de la zero pe Babel 6, dar am'm obtinerea regeneratorRuntime nu este definit.
.babelrc fișier
{
"presets": [ "es2015", "stage-0" ]
}
pachet.fișier json
"devDependencies": {
"babel-core": "^6.0.20",
"babel-preset-es2015": "^6.0.15",
"babel-preset-stage-0": "^6.0.15"
}
.fișier js
"use strict";
async function foo() {
await bar();
}
function bar() { }
exports.default = foo;
Folosind-o în mod normal, fără asincron/așteaptă funcționează foarte bine. Orice idei ce-am'm a greșit?
babel-polyfill
este necesar. Trebuie să instalați, de asemenea, în scopul de a obține asincron/așteaptă de lucru.
npm i -D babel-core babel-polyfill babel-preset-es2015 babel-preset-stage-0 babel-loader
pachet.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 cu async/așteaptă (cod proba)
"use strict";
export default async function foo() {
var s = await bar();
console.log(s);
}
function bar() {
return "bar";
}
În fișierul de pornire
require("babel-core/register");
require("babel-polyfill");
Dacă utilizați webpack aveți nevoie pentru a pus-o ca pe prima valoare de "intrare" matrice în webpack fișier de configurare (de obicei webpack.config.js
), ca pe @Cemen comentariu:
module.exports = {
entry: ['babel-polyfill', './test.js'],
output: {
filename: 'bundle.js'
},
module: {
loaders: [
{ test: /\.jsx?$/, loader: 'babel', }
]
}
};
Dacă doriți să rulați teste cu babel apoi utilizați:
mocha --compilers js:babel-core/register --require babel-polyfill
În afară de polyfill, eu folosesc babel-plugin-transforma-execuție. Plugin-ul este descris ca:
Exteriorizeze trimiteri la ajutoare și builtins, automat polyfilling codul fără a polua globals. Ce înseamnă de fapt, deși? Practic, puteți utiliza built-in-uri, cum ar fi Promisiunea, Set, Simbol etc., precum și de a folosi toate Babel caracteristici care necesită un polyfill perfect, fără poluare globală, ceea ce face extrem de potrivit pentru biblioteci.
De asemenea, include suport pentru async/așteaptă, împreună cu alte construit-in-uri de ES 6.
$ npm install --save-dev babel-plugin-transform-runtime
În .babelrc
, adaugă runtime plugin
{
"plugins": [
["transform-runtime", {
"regenerator": true
}]
]
}
Notă Daca're folosind babel 7, pachetul a fost redenumit @babel/plugin-transforma-execuție.
Babel 7 Utilizatori
Am avut unele probleme cu obtinerea în jurul valorii de acest lucru deoarece cele mai multe informații au fost înainte de babel versiuni. Pentru Babel 7, instalați aceste două dependențe:
npm install --save @babel/runtime
npm install --save-dev @babel/plugin-transform-runtime
Și, în .babelrc, adauga:
{
"presets": ["@babel/preset-env"],
"plugins": [
["@babel/transform-runtime"]
]
}
Acesta funcționează dacă setați țintă la Chrome. Dar s-ar putea să nu funcționeze pentru alte obiective, vă rugăm să consultați: https://github.com/babel/babel-preset-env/issues/112
Deci, acest răspuns este NU destul de buna pentru întrebarea inițială. Voi păstra de aici ca o trimitere la babel-preset-env
.
O soluție simplă este de a adăuga `import 'babel-polyfill' la început de cod.
Dacă utilizați webpack, o soluție rapidă este de a adăuga babel-polyfill
așa cum se arată mai jos:
entry: {
index: ['babel-polyfill', './index.js']
}
Verifica acest proiect: https://github.com/babel/babel-preset-env
yarn add --dev babel-preset-env
Utilizați următoarele babel de configurare:
{
"presets": [
["env", {
"targets": {
"browsers": ["last 2 Chrome versions"]
}
}]
]
}
Apoi, aplicația ar trebui să fie bun pentru a merge în ultimele 2 versiuni de browser-ul Chrome.
Puteți seta, de asemenea, Nod ca obiective sau ajusta browsere listă în funcție de https://github.com/ai/browserslist
Îmi place foarte mult babel-preset-env
's filosofie: spune-mi ce mediu vrei să suport, NU-mi spune cum să le sprijine. L's frumusețea declarativ de programare.
Am'am testat "asincron" așteaptă
și FAC de lucru. Eu nu't știu cum au de lucru și chiar nu - 't vreau să știu. Vreau să-mi petrec timpul pe propriul meu cod mea și logica de afaceri în loc. Datorită babel-preset-env
, se eliberează-mă de la Babel configurare iad.
Alternativ, dacă nu't nevoie de toate modulele babel-polyfill
oferă, puteți specifica doar `babel-regenerator-execuție în webpack config:
module.exports = {
entry: ['babel-regenerator-runtime', './test.js'],
// ...
};
Atunci când se utilizează webpack-dev-server cu HMR, acest lucru a redus numărul de fișiere trebuie să compila pe fiecare construi de destul de o mulțime. Acest modul este instalat ca parte a babel-polyfill
deci, dacă aveți deja că te're bine, în caz contrar puteți să-l instalați separat cu npm i-D babel-regenerator-runtime`.
Meu soluție simplă:
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"
]
}
babel-regenerator-runtime este acum [învechit][1], în loc să folosim
regenerator-runtime`.
Pentru a utiliza runtime generator cu webpack " și " babel` v7:
instala regenerator-runtime
:
npm i -D regenerator-runtime
Și apoi se adaugă în webpack de configurare :
entry: [
'regenerator-runtime/runtime',
YOUR_APP_ENTRY
]
Ca de Babel 7.4.0, @babel/polyfill
e învechit.
În general, există două moduri de a instala polyfills/regenerator: prin nume global (Opțiunea 1) sau ca ponyfill (Opțiunea 2, fără a poluării globale).
Opțiunea 1: @babel/preset-env
presetări: [ ["@babel/preset-env", { useBuiltIns: "de utilizare", corejs: 3, // sau 2, obiective: { firefox: "64", // sau orice țintă de a alege . }, }] ]
va utiliza automat regenerator-execuție " și " core-js
conform țintă. Nu este nevoie de a importa orice manual. Don't uitați să instalați runtime dependențe:
npm eu ... salva regenerator-runtime bază-js
Alternativ, se poate seta `useBuiltIns: "de intrare" și de import-l manual:
import "regenerator-rulare/execuție"; import "core-js/stabile"; // dacă polyfills sunt, de asemenea, nevoie de
Opțiunea 2: @babel/transforma-execuție " cu " @babel/runtime
(nici un domeniu de aplicare global de poluare)
{ "plugin-uri": [ [ "@babel/plugin-transforma-runtime", { "regenerator": adevărat, corejs: 3 // sau 2; dacă polyfills nevoie ... } ] ] }
Instalați-l:
npm i-D @babel/plugin-transforma-execuție npm am @babel/execuție
Dacă utilizați core-js polyfills, instala @babel/runtime-corejs2 " sau " @babel/runtime-corejs3
în loc, a se vedea aici.
Noroc
Am avut ambele 'polyfill import' meu 'asincron funcția' în același dosar, cu toate acestea am fost folosind funcția sintaxă care dispozitive de ridicare deasupra polyfill care mi-ar da ReferenceError: regeneratorRuntime nu este definit
de eroare.
import "babel-polyfill"
async function myFunc(){ }
import "babel-polyfill"
var myFunc = async function(){}
pentru a preveni aceasta fiind plasată deasupra polyfill de import.
Actualizați .babelrc
dosar, în conformitate cu următoarele exemple, se va lucra.
Dacă utilizați `@babel/preset-env pachet
{
"presets": [
[
"@babel/preset-env", {
"targets": {
"node": "current"
}
}
]
]
}
or if you are using babel-preset-env package
{
"presets": [
[
"env", {
"targets": {
"node": "current"
}
}
]
]
}
Dacă utilizați babel-preset-etapa a-2
, atunci trebuie doar pentru a porni scriptul cu --necesită babel-polyfill
.
În cazul meu, această eroare a fost aruncat de Moca
teste.
Următoarele rezolvat problema
mocha \"server/teste/**/*.test.js\" --compilatoare js:babel-registrul --necesită babel-polyfill
Am început să primesc această eroare după convertirea mea de proiect într-un proiect typescript. Din ce am inteles, problema provine de la async/așteaptă a nu fi recunoscut.
Pentru mine eroarea a fost remediată prin adăugarea a două lucruri să-mi setup:
...intrare: ['babel-polyfill', './index.js'],
...
{ "presetări": ["es2015"], "plugin-uri": ["transforma-asincron-pentru-generator de"] }
Am avut de a instala câteva lucruri în devDependencies în pachetul meu.fișier json, precum și. Și anume, am fost lipsă babel-plugin-transforma-asincron-pentru-generator, babel-polyfill și 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"
}
Am luat codul de la un foarte util și concis GitHub gist poti gasi aici.
Te're obtinerea o eroare, deoarece asincron/așteaptă folosesc generatoare, care sunt o ES2016 caracteristică, nu ES2015. O modalitate de a repara acest lucru este de a instala babel presetate pentru ES2016 (npm install-salva babel-preset-es2016
) și compila să ES2016 în loc de ES2015:
"presets": [
"es2016",
// etc...
]
Ca alte răspunsuri menționează, de asemenea, puteți utiliza polyfills (deși, asigurați-vă că încărca polyfill prima înainte de orice alt cod ruleaza). Alternativ, dacă nu't doriți să includeți toate polyfill dependențe, puteți utiliza babel-regenerator-execuție sau babel-plugin-transforma-execuție.
Am fixat această eroare prin instalarea babel-polyfill
npm install babel-polyfill --save
apoi am importat în aplicația mea punctul de intrare
import http from 'http';
import config from 'dotenv';
import 'babel-polyfill';
import { register } from 'babel-core';
import app from '../app';
pentru testare am inclus-necesita babel-polyfill în script de test
"test": "export NODE_ENV=test|| SET NODE_ENV=test&& mocha --compilers
js:babel-core/register --require babel-polyfill server/test/**.js --exit"
Am avut această problemă în Chrome. Similar cu RienNeVaPlus răspunsul lui, asta a rezolvat-o pentru mine:
npm install --save-dev regenerator-runtime
Apoi, în codul meu:
import 'regenerator-runtime/runtime';
Fericit pentru a evita suplimentar de 200 kB la babel-polyfill`.
Noi Răspunsul Ce urmează răspunsul meu ?
Ans: Pentru că am de gând să vă dau un răspuns cu cea mai recentă Actualizare versiune npm proiect .
04/14/2017
"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"
Dacă Utilizați această versiune sau mai SUS versiune de Npm si toate celelalte ... DECI, trebuie doar să se schimbe :
webpack.config.js
module.exports = {
entry: ["babel-polyfill", "./app/js"]
};
După schimbare webpack.config.js fișierele trebuie Doar să adăugați această linie la partea de sus a codului .
import "babel-polyfill";
Verifica acum totul este ok. LINK-ul de referință
De asemenea, Datorită @BrunoLM pentru Răspuns frumos.
Țintă browsere am nevoie pentru a sprijini deja suport asincron/așteaptă, dar atunci când scrieți mocha teste, fără stabilirea corectă încă mai am această eroare.
Cele mai multe dintre articole am căutat pe google sunt depășite, inclusiv răspunsul acceptat și de înaltă votat răspunsuri aici, adică nu't nevoie de polyfill", "babel-regenerator-execuție", " babel-plugin-transforma-runtime`. etc. dacă browser-ul dumneavoastră țintă(s) sprijină deja asincron/așteaptă (desigur, dacă nu ai nevoie de polyfill)
Eu nu't doriți să utilizați webpack
fie.
Tyler Lung's de fapt răspunsul e pe drumul cel bun, deoarece el a sugerat babel-preset-env
(dar am omis-o mai întâi ca el a menționat polifill la început). Încă mai am `ReferenceError: regeneratorRuntime nu este definit în primul rând, apoi mi-am dat seama că a fost pentru că nu am't setați țintă. După setarea țintă pentru nodul I repara regeneratorRuntime eroare:
"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
}]
]
}
Pentru a babel7 utilizatori și ParcelJS >= 1.10.0 utilizatori
npm i @babel/runtime-corejs2
npm i --save-dev @babel/plugin-transform-runtime @babel/core
.babelrc
{
"plugins": [
["@babel/plugin-transform-runtime", {
"corejs": 2
}]
]
}
luate de la https://github.com/parcel-bundler/parcel/issues/1762
1 - Instalați babel-plugin-transforma-asincron-la-modul-metoda, 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 - Adăugați în js babel polyfill:
import 'babel-polyfill';
3 - Adăugați plug-in .babelrc:
{
"presets": ["es2015"],
"plugins": [
["transform-async-to-module-method", {
"module": "bluebird",
"method": "coroutine"
}]
]
}
Sursa : http://babeljs.io/docs/plugins/transform-async-to-module-method/
Am avut un setup cu webpack folosind presetări: ['es2015', 'etapa-0']` și mocca care a fost teste elaborate de către webpack.
Să-mi fac asincron/așteaptă în testele de muncă tot ce a trebuit să faceți este să adăugați
mocha --necesită babel-polyfill` opțiune.