Maison >outils de développement >phpstorm >Comment configurer la compilation Babel sous phpstorm

Comment configurer la compilation Babel sous phpstorm

藏色散人
藏色散人avant
2021-03-18 17:36:262049parcourir

La colonne tutorielle suivante de phpstorm vous présentera comment configurer la compilation babel sous phpstorm. J'espère qu'elle sera utile aux amis qui en ont besoin !

Comment configurer la compilation Babel sous phpstorm

Configurer la compilation babel sous phpstorm

Utiliser les outils d'extension pour compiler babel directement sous phpstorm, principalement pour jsx Compile sans introduire Browser.min.js. Il est utile pour apprendre Reactjs. Il a fallu beaucoup de détours aux débutants pour le comprendre. J'espère que cela sera utile aux débutants. Voici les étapes de configuration :

Tout d'abord. , installez, je ne parlerai pas de nodejs et de phpstorm. Consultez le site officiel

Ensuite, npm install babel babel-cli babel-preset-es2015 babel-preset-react
(notez que vous ne le faites pas). Vous n'avez pas besoin de vous soucier qu'il s'agisse d'une installation globale ou non, nodejs Vous pouvez également choisir de l'installer sur le disque d e f...)

Ouvrez phpstorm, cliquez sur fichier->setting->tools-> ;Outils externes en haut à gauche, puis cliquez sur le signe plus ci-dessus pour ajouter un nouvel outil d'extension :

Comment configurer la compilation Babel sous phpstorm

Remplissez le nom de l'outil d'extension BABEL. La configuration suivante est comme indiqué ci-dessus. Cliquez sur OK après la configuration.

Après la configuration, commencez à définir les touches de raccourci pour l'exécution de Babel : revenez aux paramètres pour rechercher la clé, cliquez sur le plan de touches :

Entrez Outils externes->BABEL (le nom de l'outil de compilation Babel ), double-cliquez sur Ajouter les paramètres de raccourci clavier (j'utilise Alt+n, tant que les touches de raccourci n'entrent pas en conflit)
La dernière étape consiste à ouvrir le fichier jsx et Alt+n pour exécuter :

Comment configurer la compilation Babel sous phpstorm

Le fichier js généré est référencé dans la page html, et vous pouvez ensuite voir l'effet en ouvrant le navigateur. La configuration de babel-preset-es2015 est la même méthode, en utilisant différentes touches de raccourci.

Vous devez avoir une certaine compréhension de Reactjs pour que la méthode de configuration de cet article puisse être utilisée correctement (^__^) (également applicable sous webstorm).

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer