Comment développer React avec vscode

Comment le développement de vscode réagit-il ?

Utilisez l'éditeur VSCode pour créer un projet React.js

Recommandations de didacticiel associées : Tutoriel vscode

Préparation de l'environnement :

1. Téléchargez et installez VSCode, Node.js, Yarn

2. Ouvrez le terminal de ligne de commande ou PowerShell, entrez Yarn Global Add Create-react-app pour installer l'échafaudage de réaction create-react-. app

3. Ouvrez VSCode et installez les plug-ins correspondants

Nécessaire : ​​ESLint, DocumentThis, EasyLess, Complete JSDoc Tags, vscode-flow-ide, React native Tools, vscode- wechat, npm, babel-javascript, débogueur pour chrome, git lens, node debug 2,

Facultatif : extraits de code javascript (ES6), extraits de code reactjs, extraits de réaction-native/react/redux pour es6/es7 , mettez en surbrillance les mauvais caractères, surbrillance des couleurs, Path Intellisense, diff partiel

2. Créez une nouvelle démo

1 Utilisez la touche de raccourci ctrl+` dans l'éditeur VSCode pour ouvrir le terminal

.

2. Entrez create-react-app dans la démo du terminal, créez automatiquement un projet nommé demo

3. cd demo dans le projet de démonstration

4. exécuter le projet

3. utilisé dans le projet React echarts

1 Entrez la commande Yarn Add echarts dans le terminal pour introduire les echarts

2 dans le fichier js dont vous avez besoin. pour utiliser echarts, introduisez le module echarts. Vous pouvez consulter la liste spécifique des modules pouvant être importés à la demande demo->node_modules->echarts->index.js fichier

// 引入 ECharts 主模块
import echarts from 'echarts/lib/echarts';
import 'echarts/lib/chart/line';
// 引入柱状图
import 'echarts/lib/chart/bar';
// 引入提示框和标题组件
import 'echarts/lib/component/tooltip';
import 'echarts/lib/component/title';

4. Raccourci. touches

Utilisez ctrl+c dans le terminal pour quitter l'opération par lots.

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!