vscodeで反応する開発方法

#vscode 開発はどのように反応しますか?

VSCode エディターを使用して React.js プロジェクトを作成する

推奨関連チュートリアル:

vscode チュートリアル

1. 環境の準備:

1. VSCode、Node.js、Yarn

2. コマンド ライン ターミナルまたは PowerShell を開き、「yarn global add create-react-app」と入力して、React Scaffolding create-react- をインストールします。 app

3. VSCode を開いて、対応するプラグインをインストールします

必要なもの: ESLint、DocumentThis、EasyLess、Complete JSDoc Tags、vscode-flow-ide、React Native Tools、vscode- wechat、npm、babel-javascript、chrome 用デバッガー、git レンズ、ノード デバッグ 2、

オプション: javascript (ES6) コード スニペット、reactjs コード スニペット、es6/es7 用の React-native/react/redux スニペット、不正な文字の強調表示、色の強調表示、パス インテリセンス、部分的な差分

2. 新しいデモを作成します

1. ショートカット キー ctrl ` を使用して、VSCode エディターでターミナルを開きます

2. ターミナル デモに「create-react-app」と入力し、demo という名前のプロジェクトを自動的に作成します。

3. cd デモをデモ プロジェクトに追加します。

4. ヤーンの開始またはヤーンのビルドを実行します。プロジェクトを実行します

3. React プロジェクト echarts

1 で使用します. ターミナルにコマンド Yarn add echarts を入力して、echarts

2. 必要な js ファイルにecharts を使用するには、echarts モジュールを導入します。オンデマンドで導入できるモジュールの特定のリストを表示できます。demo->node_modules->echarts->index.js file

// 引入 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. ショートカットキー

ターミナルで Ctrl C を使用してバッチ操作を終了します。

以上がvscodeで反応する開発方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。