Vueは、Vue足場環境をインストールするための最も包括的なインストールVue CLIプロジェクトです

足場のインストールおよび展開プロジェクトプロセス

1:ソフトウェアnodejs 6.xx
1.1に依存:nodejs
http://nodejs.cn/download/
https://npm.taobao.org/mirrors/node/
X86 for 32 windows
X64 for 64 windows
1.2:次のステップ
インストールディレクトリ:中国語、スペースなし
c:/プログラムファイル/ nodejs
1.3:検出(windows-> start-> run-> cmd)
node -v
ここに画像の説明を挿入

2:cnpmツールをインストールします(nodejsツールnpmインストールソフトウェア)
npm install -g cnpm --registry = https://registry.npm.taobao.org
#npm install tool
#install install uninstall remove
#-g global#
ttps:// registry.npm.taobao.org Taobaoミラーサイト

検出#
ここに画像の説明を挿入
3:VUE-cliの足場をインストール
--global VUE-CLI CNPMをインストール
4:プロジェクト(プロジェクト自動的に完全なディレクトリと設定ファイル)(別売)を初期化する(足場)によると
#なしクラス初期化
VUEのinit WebPACKのプロジェクト名

VUEの初期化webpack my-project#
プロジェクト名を尋ねる:my-project

インストール:vue-router?はい/いいえはい

インストール:EsLint?いいえ

他はすべていいえ

検出:自動生成されたディレクトリ
ここに画像の説明を挿入
#ビルドスクリプトディレクトリ#config
構成ディレクトリ(…)
#node_modulesすべてのnodejs依存関係ツールキットディレクトリ(空)
#srcコードディレクトリ
アセットリソースディレクトリ(img / css / js)
コンポーネントコンポーネントディレクトリ
ルータールーティング構成
App.vueトップレベルのコンポーネント
main.jsプログラムエントリjs
#package.jsonプロジェクト記述ファイル
注:tpls.zip
5:依存ツールキット
e:
cd tpls
e:/ tpls> cnpm installをインストール
注:入力した赤いコマンド、黒は自動的に表示される
5.1インストールvue-resourceをプロジェクトに入れ、現在のプロジェクトを見つけます

次のように入力します:npm install vue-resource --save

5.2インストールが完了したら、次のようにmain.jsにインポートします。

'vue-resource'からVueResourceをインポートする

Vue.use(VueResource)

6:プロジェクトを開始します
cnpm run dev
注:サーバーを開始します:ポート8080
注:Apacheの
検出は必要ありません:http : //127.0.0.1 :8080/ #/ サーバーを
停止します:ctrl + c
7:コード開発
src

8:vueプロジェクトの起動プロセス
cnpm run devを実行すると、現在のディレクトリで
package.jsonファイルが見つかり、サーバーのデフォルトポート8080が起動します。


srcディレクトリでmain.jsファイルを見つけて、プロジェクトに唯一の新しいVue()を作成します。テンプレートコンテンツAppをロードするには、AppはsrcディレクトリのApp.vueの最後のファイル
です。

srcディレクトリにrouterフォルダーがあり、このフォルダーの下にindex.js
ファイルがあります。このファイルは、ルーティングディクショナリを構成し、ルーティングアドレスを指定するためのものです

12件の元の記事を公開 いいね5 1559にアクセス

おすすめ

転載: blog.csdn.net/qq_43562926/article/details/105591333