VUE環境を構築する方法
Windows10システムでVUE環境を構築する方法
1.まず、node.jsをダウンロードする必要があります。
vueの動作は、ノードのnpm管理ツールによって異なります。公式ウェブサイトhttp://nodejs.cnからダウンロードできます。
2.ダウンロードが完了したら、node.jsをインストールする必要があります
ダブルクリックしてインストールした後、コマンドラインを開き、ノード-vを入力して、インストールが成功したかどうかを確認します。
図は、インストールが成功したことを示しています。
3、インストール後、cnpmミラーを交換する必要があります
ご存知のとおり、中国でのnpmの使用は特に遅いため、Taobaoのnpmミラーを使用することをお勧めします。
そうすると、Taobaoのcnpm管理ツールがnpm管理ツールに置き換わります。
1.次に、node.jsのインストールディレクトリに2つの新しいフォルダnode_globalとnode_cacheを作成します
2. 2つのフォルダーを作成した後、cmdウィンドウに次のコマンドを入力します(2つのフォルダーのパス)。
npm config set prefix "E:\node\node_global"
npm config set cache "E:\node\node_cache"
3.コマンドラインを開き、npm install -g cnpm --registry = https://registry.npm.taobao.orgと入力して、Taobaoミラーをダウンロードします
。この図は、Taobaoミラーがダウンロードされていることを示しています。
この図は、ダウンロードが完了したことを示しています。
3つ目は、Node.js環境変数の構成です。
コンピュータ環境変数を設定し、[マイコンピュータ]-> [プロパティ]-> [システムの詳細設定]-> [環境変数]を右クリックし
、環境変数の構成を開始し、システム変数で[新規]をクリックして、新しいNODE_PATHを
作成します。nodejsディレクトリパスをコピーします( E:\ node)次に、ユーザー変数でパスを選択し、[編集]-> [新規]->コピーしたばかりのアドレスを入力-> [完了の確認]をクリックします。
この時点で、npm環境変数の構成は完了しており、コマンドラインでnpm-vを引き続き使用できます。
6.6。次に、cnpmの環境変数を構成する必要があります。Taobao
ミラーのインストールが完了した後、E:\ nodeのnode_global(自分で作成したフォルダー)モジュールにデータが生成されます。次に、実行する必要があるのは次のとおりです。
ユーザー変数でパスを選択するには、[編集]-> [新規]->ノードグローバルモジュールのディレクトリの場所を入力します(E:\ node \ node_global)->完了を確認します。
7. cnpm環境変数の構成が成功したことを確認します。
コマンドラインを再起動し、コマンドラインにcnpm -vと入力します。次のインターフェイスが表示された場合、構成は成功しています。
第四に、vueスキャフォールディングをインストールします
コマンドラインに入力します
cnpm install -g @vue/cli
# OR
yarn global add @vue/cli
次の図に示すように、足場をインストールするには、インストールが完了し
ます。コマンドラインに入力します。
vue -V
足場が正常にインストールされているかどうかを確認するこれ
までのところ、足場は正常にインストールされています
5、最初のvueプロジェクトを作成します
1.コマンドラインにvueuiと入力すると、
次の画像
が表示され、次のWebページがポップアップ表示され
ます。2。プロジェクトの作成
次に、プロジェクトの作成を開始します。
次の図に示すようにプロジェクトの作成を開始すると、コマンドラインが進行し
ます。プロジェクトが作成されるのを待つだけです。
このインターフェイスが表示され、コマンドラインが次の図になります。 、作成は成功しました。3。プロジェクトを開き
ます(エディターはこのステップをスキップできません)
。WebstormまたはIDEAでこのプロジェクトを開くことができます。ここでIDEAがオンになっていることを示します(IDEAはノードプラグインをインストールする必要があります。インストールしないとインストールできません)
これはIDEAで開いた結果であり、IDEAはプラグインをインストールしていません。次に、ファイル->設定->プラグイン
でVue.jsを検索してインストールします。インストールが完了したら、IDEAを再起動する必要があります。再起動後、作成したばかりのプロジェクトを開きます。赤い丸が変わっていることがわかり
ます。4。プロジェクトを起動し(コンパイラなしで、手順5を参照)
、ターミナルで次のコマンドを1つずつ実行します。
1.npm install
2.npm run serve
最初のコマンドを
実行すると、2番目のコマンドを実行したときに表示されます。これは
、操作が成功したことを意味します。青いWebサイトのリンクをクリックしてジャンプします。
コンパイラがない場合は、次の手順を実行します。次
の図に示すように、cmdコマンドラインでプロジェクトの場所に移動します(ここではプロジェクト名はjiaochengdemo1です)。
次に、
ここで手順4のコマンドを入力します。完璧なVUEプロジェクトは、作成が完了したことです。