Właśnie zacząłem używać Babel do kompilowania kodu javascript z ES6 do ES5. Kiedy zaczynam używać Promises, wygląda na to, że nie działa. Witryna Babel zapewnia wsparcie dla obietnic za pośrednictwem polyfills.
Bez szczęścia postarałem się dodać:
require("babel/polyfill");
lub
import * as p from "babel/polyfill";
Dzięki temu otrzymam następujący błąd podczas ładowania mojej aplikacji:
Nie można znaleźć modułu „babel / polyfill”
Szukałem modułu, ale wydaje mi się, że brakuje mi tutaj jakiejś podstawowej rzeczy. Próbowałem też dodać stary i dobry NPM bluebird, ale wygląda na to, że nie działa.
Jak używać polyfills firmy Babel?
npm install _name_
npm install --save babel-polyfill
irequire('babel-polyfill)
.Odpowiedzi:
Zmieniło się to nieco w babel v6.
Z dokumentów:
Instalacja:
$ npm install babel-polyfill
Użycie w Node / Browserify / Webpack:
Aby dołączyć polyfill, musisz go umieścić na górze punktu wejścia do aplikacji.
require("babel-polyfill");
Użycie w przeglądarce:
dostępne z
dist/polyfill.js
pliku wbabel-polyfill
wydaniu npm. Należy to uwzględnić przed całym skompilowanym kodem Babel. Możesz dołączyć go do skompilowanego kodu lub dołączyć go<script>
przed nim.UWAGA: Nie rób
require
tego przez browserify itp., Użyjbabel-polyfill
.źródło
Array.protorype.findIndex()
nie działają bez polyfill, a babel nie zgłosi wyjątku podczas transpilacji? Czy taka jest natura Polyfill ™?Dokumentacja Babel opisuje to dość zwięźle:
Upewnij się, że potrzebujesz go w punkcie wejścia do aplikacji, zanim cokolwiek innego zostanie wywołane. Jeśli używasz narzędzia takiego jak webpack, staje się to całkiem proste (możesz powiedzieć webpakowi, aby dołączył go do pakietu).
Jeśli używasz narzędzia takiego jak
gulp-babel
lubbabel-loader
, musisz również zainstalowaćbabel
sam pakiet, aby użyć wypełnienia.Pamiętaj również, że w przypadku modułów, które mają wpływ na zasięg globalny (polyfills i tym podobne), możesz użyć krótkiego importu, aby uniknąć nieużywanych zmiennych w module:
źródło
import 'babel-core/polyfill'
bez instalacjibabel
i działało dobrze.import 'babel-core/polifyll'
działa. Wypróbowałem to bez zainstalowanegobabel
i nie zadziałało. Przy okazji: ssube advice działa.W przypadku Babel w wersji 7, jeśli używasz @ babel / preset-env, aby uwzględnić polyfill, wystarczy dodać flagę „useBuiltIns” z wartością „usage” w konfiguracji babel. Nie ma potrzeby, aby wymagać ani importować polyfillu w punkcie wejścia aplikacji.
Po określeniu tej flagi babel @ 7 zoptymalizuje i uwzględni tylko te wypełnienia, których potrzebujesz.
Aby użyć tej flagi, po instalacji:
Po prostu dodaj flagę:
do pliku konfiguracyjnego Babel o nazwie „babel.config.js” (również nowy w Babel @ 7), w sekcji „@ babel / env”:
Odniesienie:
Aktualizacja, sierpień 2019 r .:
Wraz z wydaniem Babel 7.4.0 (19 marca 2019 r.) @ Babel / polyfill jest przestarzałe. Zamiast instalować @ babe / polyfill, zainstalujesz core-js:
Nowy wpis
corejs
zostanie dodany do twojego babel.config.jspatrz przykład: https://github.com/ApolloTang/stackoverflow-eg--babel-v7.4.0-polyfill-w-core-v3
Odniesienie:
źródło
useBuiltIns: "usage"
nie działa po mojej stronie. Po prostu nie zawiera żadnych polyfilów w pakiecie (przykład: używam generatorów i otrzymuję błąd „regeneratorRuntime nie jest zdefiniowany”). Jakieś pomysły?Jeśli plik package.json wygląda mniej więcej tak:
Otrzymujesz
Cannot find module 'babel/polyfill'
komunikat o błędzie, prawdopodobnie musisz zmienić instrukcję importu OD:DO:
I upewnij się, że pojawia się przed jakimkolwiek innym
import
stwierdzeniem (niekoniecznie w punkcie wejścia do aplikacji).Źródła: https://babeljs.io/docs/usage/polyfill/
źródło
Po pierwsze, oczywista odpowiedź, której nikt nie udzielił, musisz zainstalować Babel w swojej aplikacji:
(lub
babel-core
jeśli zamiast tego chceszrequire('babel-core/polyfill')
).Poza tym mam podstawowe zadanie transpozycji moich es6 i jsx jako kroku kompilacji (tj. Nie chcę używać
babel/register
, dlatego staram się używaćbabel/polyfill
bezpośrednio w pierwszej kolejności), więc chciałbym położyć większy nacisk na tę część odpowiedzi @ ssube:Napotkałem jakiś dziwny problem, w którym próbowałem wymagać
babel/polyfill
od jakiegoś pliku startowego środowiska współdzielonego i otrzymałem błąd, do którego odwołał się użytkownik - myślę, że mógł to mieć coś wspólnego z tym, jak zamówienia importu babel w porównaniu z wymaganiami, ale nie mogę odtworzyć teraz. W każdym razie, przeniesienieimport 'babel/polyfill'
pierwszej linii w skryptach startowych klienta i serwera rozwiązało problem.Zauważ, że jeśli zamiast tego chcesz użyć
require('babel/polyfill')
, upewnię się, że wszystkie inne instrukcje modułu ładującego również są wymagane i nie używają importu - unikaj mieszania tych dwóch. Innymi słowy, jeśli masz jakiekolwiek instrukcje importu w swoim skrypcie startowym, wprowadźimport babel/polyfill
pierwszy wiersz skryptu zamiastrequire('babel/polyfill')
.źródło
sudo
z npm docs.npmjs.com/getting-started/fixing-npm-permissionshttps://www.quora.com/What-does-babel-polyfill-do
https://hackernoon.com/polyfills-everything-you-ever-wanted-to-know-or-maybe-a-bit-less-7c8de164e423
źródło
Jak Babel mówi w dokumentacji , dla Babel> 7.4.0 moduł @ babel / polyfill jest przestarzały , więc zaleca się bezpośrednie użycie bibliotek core-js i regenerator-runtime, które wcześniej były zawarte w @ babel / polyfill.
Więc to zadziałało dla mnie:
następnie dodaj na samej górze początkowego pliku js:
źródło