vscodeで反応する開発方法-VSCode-php.cn

vscodeで反応する開発方法

藏色散人

リリース： 2020-04-08 10:01:40

オリジナル

4204 人が閲覧しました

#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 &#39;echarts/lib/echarts&#39;;
import &#39;echarts/lib/chart/line&#39;;
// 引入柱状图
import &#39;echarts/lib/chart/bar&#39;;
// 引入提示框和标题组件
import &#39;echarts/lib/component/tooltip&#39;;
import &#39;echarts/lib/component/title&#39;;

ログイン後にコピー

4. ショートカットキー

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

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