Comment puis-je installer le babel-polyfill de la bibliothèque?

La Babel docs décrire cette jolie façon concise:

Babel comprend un polyfill qui comprend un personnalisé régénérateur d'exécution
et core.js.

Cela permettra d'émuler un plein ES6 environnement. Cette polyfill est
automatiquement chargé lors de l'utilisation de babel-nœud et babel/register.

Assurez-vous que vous avez besoin d'elle au point d'entrée à votre demande, avant toute autre chose est appelée. Si vous êtes en utilisant un outil comme webpack, qui devient assez simple (vous pouvez dire webpack de l'inclure dans le bundle).

Si vous êtes en utilisant un outil comme gulp-babel ou babel-loader, vous devez également installer la babel paquet lui-même à utiliser le polyfill.

Également noter que pour les modules qui affectent la portée globale (polyfills et autres), vous pouvez utiliser un laconique à l'importation pour éviter d'avoir des variables inutilisées dans votre module:

import 'babel/polyfill';

Pour Babel version 7, si vous utilisez @babel/preset-env, afin d'inclure polyfill tout ce que vous avez à faire est d'ajouter un drapeau "useBuiltIns" avec la valeur de "l'usage" dans votre babel de configuration. Il n'est pas nécessaire d'exiger ou d'importation de polyfill au point d'entrée de votre Application.

Avec ce drapeau spécifié, [email protected] permettra d'optimiser et incluent uniquement les polyfills a besoin de vous.

À l'utilisation de ce drapeau, après l'installation:

npm install --save-dev  @babel/core @babel/cli @babel/preset-env
npm install --save @babel/polyfill

Il suffit d'ajouter le drapeau:

useBuiltIns: "usage" 

à votre babel fichier de configuration appelé "babel.config.js" (également de nouvelles de [email protected]), dans le cadre du "@babel/env" section:

//file: babel.config.js

module.exports = () => {
   const presets = [
      [
         "@babel/env", 
         { 
             targets: { /* your targeted browser */ },
             useBuiltIns: "usage"  //<-----------------*** add this
         }
      ]
   ];

   return { presets };
};

Référence:

• l'utilisation de#polyfill
• babel-polyfill#usage-en-nœud-browserify-webpack
• babel-preset-env#usebuiltins

---

Mise À Jour Août 2019:

Avec la sortie de Babel 7.4.0 (19 Mars 2019) @babel/polyfill est obsolète. Au lieu d'installer @babe/polyfill, vous permettra d'installer de base-js:

npm install --save core-[email protected]

Une nouvelle entrée corejs est ajouté à votre babel.config.js

//file: babel.config.js

module.exports = () => {
   const presets = [
      [
         "@babel/env", 
         { 
             targets: { /* your targeted browser */ },
             useBuiltIns: "usage",
             corejs: 3  //<----- specify version of corejs used
         }
      ]
   ];

   return { presets };
};

voir l'exemple: https://github.com/ApolloTang/stackoverflow-eg--babel-v7.4.0-polyfill-w-core-v3

Référence:

• 7.4.0 Sortie: core-js 3, statique méthodes privées et partielle
  application
• [email protected], babel et un regard vers l'avenir

babel-polyfill vous permet d'utiliser l'ensemble complet de l'ES6 fonctions au-delà de
les changements de syntaxe. Cela inclut des fonctionnalités telles que de nouveaux objets intégrés
comme des Promesses et WeakMap, ainsi que de nouvelles méthodes statiques comme
Tableau.d'ou l'Objet.attribuer.

Sans babel-polyfill, babel seulement vous permet d'utiliser des fonctionnalités telles que
flèche fonctions, déstructuration, les arguments par défaut, et d'autres
la syntaxe spécifique de fonctionnalités introduites dans l'ES6.

https://www.quora.com/What-does-babel-polyfill-do

https://hackernoon.com/polyfills-everything-you-ever-wanted-to-know-or-maybe-a-bit-less-7c8de164e423