vue.js開発環境の構築方法

vue.js 開発環境の構築: 最初に [vue.js] をインストールし、次に npm パッケージ マネージャー、モジュール、webpack、および vue スキャフォールディングをそれぞれインストールし、最後に Vue 環境の初期化とプロジェクトの依存関係のインストールを開始します。ここからVueへ 開発環境が整いました。

[推奨チュートリアル: Vue.js チュートリアル]

環境準備

Node.js Javascript 実行環境

npm Node.js 配下のパッケージ管理ツール

webpack フロントエンドリソースのモジュラー管理およびパッケージ化ツール

vue-cli足場構築ツール

cnpm npmの淘宝ミラー

Vue.jsのインストール

1. Node.js のインストールは非常に簡単で、公式 Web サイトから必要なバージョンのオペレーティング システムをダウンロードしてから、次の手順に進みます。
インストールが完了したら、コマンド ラインで「node -v」と入力します。対応するバージョン番号が表示されれば、インストールは成功です。

2. npm は、Node.js とともにインストールされるパッケージ管理ツールで、コマンド ラインに直接 npm -v と入力すると、インストールが成功したかどうかを確認できます。

npm パッケージ マネージャーは利用可能ですが、npm ダウンロードが依存する必要があるパッケージのサーバー アドレスが海外にあるため、多くのリソースへのアクセスが非常に遅くなります。タオバオの国内ミラーをインストールできます。
3. コマンド ラインに「npm install -g cnpm --registry=http://registry.npm.taabao.org」と入力します。
このように、cnpm コマンドを使用してモジュールをインストールできます:

cnpm install [name]

4. webpack をインストールします

cnpm install webpack -g

5. vue Scaffolding をインストールします

npm install vue-cli -g

Vue .js 環境を初期化する

コードを保存するための新しいフォルダーをコンピューター上に作成します。次に、コマンド ラインを使用して、このフォルダーの cd ディレクトリ パスを入力します。
その後、コマンド

vue init webpack name

を使用して vue 環境を初期化します。このコマンドは、webpack がビルド ツールであるプロジェクトを初期化することを意味します。つまり、プロジェクト全体が webpack に基づいています。インストールプロセス中にいくつかの初期化設定が行われますが、デフォルト設定を使用して Enter キーを押し続けます。

上の図からも、vue が非常に思慮深く、すぐに開始するコマンド (開始するには)

インストール プロジェクトを指示していることがわかります。依存関係

は公式ウェアハウスからインストールする必要があります。npm サーバーは海外にあるため、このステップのインストール速度は非常に遅くなります。

npm install

国内ミラー cnpm からはインストールしないでください (後で多くの依存ライブラリが失われることになります)

cnpm install

vue ルーティング モジュール vue-router とネットワーク リクエスト モジュール vue-resource# をインストールします##

cnpm install vue-router vue-resource --save

プロジェクトを開始

npm run dev

#操作が成功すると、IP とポート番号が通知されます

##このアドレスにアクセスしてください

#上の画像が表示された場合。おめでとうございます。Vue.js の旅を始める準備ができました。

以上がvue.js開発環境の構築方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。