プロジェクトVUEを開始

ノードをインストールします。1.

エンド開発フレームワークと環境は、Node.jsの開発環境をインストールし、必要なのNode.jsあり、VUE操作が実現するために、ノードのNPM管理ツールに依存して、ダウンロードhttps://nodejs.org/en/、インストールは完了ですその後、コマンドを開くためにcmdと入力を開始。(管理者権限がcmdを必要)。

ノードのバージョン番号を確認してください。2.

(自動的に環境変数を設定するには、デフォルトでインストール)良いノードをダウンロードした後、管理者CMD管理ツールを開いて入力し node -v、入力し、ビューノードのバージョン番号、バージョン番号は、インストールが成功した表示されます。

3.淘宝網NPMミラーをインストールします

NPMが海外であるので、遅く使用することを、私たちはここに淘宝網の使用cnpmVUEをインストールするには、ミラーを。
淘宝網cnpmコマンド管理ツールは、デフォルトNPM管理ツールを置き換えることができます。
コマンドを入力します。
npm install -g cnpm -registry=https://registry.npm.taobao.org

4.足場グローバルVUE-CLIを取り付けます

淘宝網のイメージが正常にインストールされた後、我々はグローバルVUE-cliを足場ことができます。
次のコマンドを入力します。cnpm install --global vue-cli 入力し、
インストールが成功したことを確認し、コマンド入力VUE、情報アウトVUE、およびインストールが正常に終了した。
次のコマンドを入力します。--global VUEをインストールcnpm -cli

新しいを構築するプロジェクト

足場を構築が完了した後、我々は新しいプロジェクトを構築するために開始したい、私が提案し、この時間は、CドライブにインストールされないようにしようVUEは、ファイルが大きいダウンロードので、あなたがディスクを変更したい場合は、は、直接D入力:ダイレクトに入力しますディスクを変更する
コマンドを入力します。vue init webpack my-project-first
入力して、my-project-first自分のフォルダの名前で、ベースにWebPACKのプロジェクトは、インストールするかどうかまでは、キャリッジリターンの後に入力されているvue-route
我々が入るので、私達は使用に突出たy キャリッジリターンを

6.注意

ここでは、以下これよりも、あなたは直接入力することができない、必要JS構文チェックがあるだろうno、直接背中を入力することができno、我々は以下のことされている、
オープンDドライブの外観、あなたはより多くのちょうど作成よりもございますフォルダ

プロジェクトフォルダを入力します。7.

:フォルダは、今、あなたは、フォルダを入力して入力することができ、まあダウンロードされているcd my-project-first新しいプロジェクトに入力します。

8.インストールがプロジェクトに依存します

様々なテンプレートが相互に依存している間に、今私たちは依存関係をインストールしたいので、プロジェクトで次のコマンドを入力します。
次のコマンドを入力します。npm install
それが遅いのインストールに使用するように強制することができるcnpm install
注:cnpm 発生した原因不明のエラーがあるかもしれません、使用してみてください。npm install

9.ファイル名を指定して実行

すべての設置環境に依存しているコマンドを入力して、我々は彼らの新しいプロジェクトVUEの動作をテストする必要があり、準備ができている:npm run devだけで、Enterキーを押します。
これは、ローカルホストにアクセスするアドレスのデフォルトはブラウザをポップアップ表示されます:8080
注:run dev唯一のVUE package.jsonパッケージ化の方法は、デフォルトの初期化プロジェクトがされてrun dev後半のパッケージアイテムは、カスタム設定することができ、run build共感を

10.アクセスを確認します

8080これは、デフォルトのポートで、アクセスするには、ブラウザで直接入力してlocalhost:8080、デフォルトのテンプレートを開くことができ、これまでのところ、VUEの開発環境設定が完了しています。

最後に、どのようにデフォルトのポートを変更するには?
我々は、初期のルートディレクトリがあることがわかりますconfig開く、コンフィギュレーションについて知っている名前を参照してください、フォルダはconfigディレクトリをindex.js変更することができ、hostかつport、IPアドレスとポートを変更することができない場合にのみ、必要に応じて、他の構成情報を変更することができます。

おすすめ

転載: www.cnblogs.com/itiaotiao/p/12626463.html