Installation et utilisation du plug-in babel converti de es6 à es5

Tout d'abord, vous devez disposer de l'un des trois gestionnaires de packages, npm ou cnpm ou yarn. Cette installation est basée sur Visual Studio Code

Cela signifie qu'il s'exécute dans le terminal de vscode. Lorsqu'il est ouvert, si une erreur est signalée après la saisie de la commande dans le terminal, il se peut que ce nœud ne soit pas installé et configuré. Vous pouvez le rechercher en ligne. Après configuration, vous devez redémarrer l'ordinateur.

0. Si vous entrez babel --version et qu'aucun numéro de version n'apparaît, vous devez exécuter le code suivant

   cnpm installer -g babel-cli

1. Nouveau dossier app01

2. Entrez le dossier app01 et initialisez le dossier actuel en tant que projet nodejs

   Après une série d'opérations, npm init ou
   npm init -y
   créera éventuellement un fichier package.json, qui enregistre les informations de configuration de l'ensemble du projet

3. Créez un nouveau dossier src, créez a.js sous le dossier src, écrivez le code ES6 dans le fichier a.js
   let a = 1;
   let test = () => {}

4. Installer babel

   cnpm install --save-dev babel-cli ou
   cnpm install --save babel-cli
   –save-dev signifie la dépendance de production, qui n'est utilisée que pendant le développement du projet -
   save signifie la dépendance du produit, qui sera également utilisée lorsque le produit est en ligne

5. Installer le préréglage Babel [règles de conversion]

   cnpm install --save-dev babel-preset-latest

6. Créez et configurez un fichier .babelrc dans le répertoire racine du projet, faites attention aux "."
   { "Presets": ["latest"] }
   
   

7. Utilisez babel pour convertir le code ES6 en code ES5
   dans le chemin src
   > babel a.js
   dans le chemin app01
   > babel src / a.js

   développer:

   1. S'il ne s'agit que d'un seul fichier, un fichier b.js sera généré après la conversion de a.js en code ES5

      babel a.js --out-fichier b.js

   2. S'il y a plusieurs fichiers, convertissez directement son dossier parent: Convertissez le dossier src en code ES5 pour générer un dossier dist

      babel src --out-dir dist

   3. Vous pouvez configurer des
      "scripts" dans le fichier package.json : { "build": "babel src --out-dir dist", }, puis chaque fois que vous exécutez npm run build dans le répertoire racine du projet, vous pouvez exécutez src Convert puis déconnectez le dossier dist