1. 事前に Vscode、nodejs などをインストールしてください。
2. vue-cli をグローバルにインストールします。vue-cli は、Vue プロジェクトを迅速に構築するのに役立ちます。
インストールコマンド:
npm install -g vue-cli
VScode のターミナルを開き、コマンド入力ボックスを表示します。 [ターミナル] - [新しいターミナル] をクリックし、上記のコマンドを入力して Enter キーを押し、インストールが完了するまで待ちます。
3. jsをパッケージ化するツールであるwebpackをインストールします
インストールコマンド:
npm install -g webpack
インストール方法は上記と同じです。その上。
4. インストールが完了したら、vue プロジェクトの作成を開始できます。まずプロジェクトを保存するフォルダーを作成し、vscode で対応するフォルダーを開き、ターミナルの対応するフォルダーに cd します。たとえば、私のフォルダーは myvue
プロジェクトの作成コマンドです。
vue init webpack myvue
と入力します。myvue はプロジェクト名で、好みに応じて選択します。
次に、いくつかの構成項目が表示されます。これらは必要に応じて構成することも、デフォルトのまま Enter キーを押すこともできます。
その後、依存関係がインストールされるまで待ち続けます。完了後、基本的な vue プロジェクトがビルドされます。完了すると、vscode の左側に次のディレクトリが表示されます。そのエントリが main.js です。
#5. 次に、プロジェクトを実行し、最初にプロジェクト フォルダーに移動し、cd myvue を実行して、次のコマンドnpm run dev
## を入力します。 #成功後、ブラウザに
:http://localhost:8080 と入力し、以下の画面が表示されれば成功です。
6. プロジェクトのパッケージ化とオンラインでのリリース
コマンドを入力します:
npm run build
完了後、プロジェクトに dist フォルダーが表示されます。このフォルダーにはパッケージ化されたコンテンツが含まれており、直接デプロイできます。
おすすめの関連記事とチュートリアル:
vscode チュートリアル以上がvscode が vue プロジェクトをビルドする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。