1.次に、最も単純な環境から始めます。
- node.jsをインストールし、node.jsの公式ウェブサイトからノードをダウンロードしてインストールします。インストールプロセスは「次のステップ」（フールインストール）まで、非常に簡単です。インストールが完了したら、コマンドラインツールを開き（win + r、次にcmdと入力）、次に示すようにnode -vと入力します。対応するバージョン番号が表示されれば、インストールは成功しています。
node.jsを公式ウェブサイトにダウンロードしてインストールした後、すでにnpm（パッケージ管理ツール）が付属しているため、ここで説明する必要があります。また、npmのバージョンは、後続のバージョンに影響を与えないように3.xx以上であることが望ましいことに注意してください。
- Taobaoミラーをインストールし、コマンドラインツールを開いて、これをコピーします（npm install -g cnpm --registry = https://registry.npm.taobao.org）（ここでの手動コピーは、マウスの右ボタンを使用したコピーです。説明）、ここでのインストールは、使用するnpmサーバーが外部のものであるためです。「依存関係」を非常にゆっくりと非常にゆっくりとインストールする場合があるため、このcnpmを使用して、必要とする「依存関係」をインストールします インストールが完了したら、下図に示すようにcnpm -vを入力します。対応するバージョン番号が表示されれば、インストールは成功しています。
- 次の図に示すように、webpackをインストールしてコマンドラインツールを開き、次のように入力します。npminstall webpack -g、webpack -vと入力します。対応するバージョン番号が表示されれば、インストールは成功しています。
-
vue-cli足場構築ツールをインストールし、コマンドラインツールを開いて次のように入力します。npminstall vue-cli -g、インストールが完了したら、vue -V（これは大文字の「V」であることに注意してください）と入力します（対応するバージョン番号が表示される場合）。インストールが成功したことを意味します。
次に、上記の4つのステップを通じて、環境とツールの準備を整え、vue-cliを使用してプロジェクトを構築する必要があります。
まず、依存パッケージをインストールします。
1. pycharmに単一のpyプロジェクトフォルダーを作成する
2.コマンドラインを開き、次のコマンドを入力します。npm init -y ------------------管理プロジェクトは、すべての依存関係情報を格納するためのjsonファイル依存関係パッケージを自動的に生成します
3.パッケージ化と圧縮のためのツールをインストールします：（グローバルパッケージツール）-> npm install webpack webpack-cli -g -D
（部分パッケージツール）-> npm install webpack webpack-cli -g
4. vueグローバルスキャフォールディングをインストールします：npm i vue-cli -g
3.プロジェクトの構築が開始されました。
1.プロジェクトを作成します（ここでの「exprice」はプロジェクトの名前ですが、何気なく名付けられているとも言えますが、主なものは「中国語は使用できません」）：vue init webpackプロジェクト名
インストールのヒントを解決します。
$ vue init webpack exprice ---------------------これは、vue scaffoldingをインストールするコマンドです
これにより、Vue 2.xバージョンのテンプレートがインストールされます。 -----------------
Vue 2.xバージョンを作成するプロジェクトの説明を以下に示します。Vue1.xの場合は、vue init webpack＃1.0 exprice
？プロジェクト名（exprice）- -------------------プロジェクト名
？プロジェクト名exprice
？プロジェクトの説明（Vue.jsプロジェクト）--------------- ------プロジェクトの説明
？プロジェクトの説明Vue.jsプロジェクト
？著者Datura ---------------------プロジェクトの作成者
？著者Datura
？Vueビルド（矢印キーを使用します）
？Vueビルドスタンドアロン
？vue-routerをインストールしますか？（Y / n）--------------------- Vueルーターをインストールするかどうか（しかし、ページアプリケーションに必要なモジュール）
？vue-routerをインストールしますか？はい
？ESLintを使用してコードをリントしますか？（Y / n）n --------------------- eslint検出ルールを有効にするかどうか、個人的には推奨しない
？ESLintを使用してコードをリントしますか？いいえ
？Karma + Mochaでユニットテストをセットアップしますか？（Y / n）
？Karma + Mochaでユニットテストを
セットアップしますか？はい？Nightwatchでe2eテストをセットアップしますか？（Y / n）n -------- -------------------- eslint検出ルールを有効にするかどうか、ここでは非常に厳密な個人的な推奨事項を示しますいいえ
？Nightwatchでe2eテストをセットアップしますか？はい？プロジェクトが作成された後で、 `npm install`を実行する必要がありますか？（推奨）npm ---------------------------プロジェクトの作成npminstallを実行する必要がありますか
デフォルトのステップコマンドを分析してインストールします：
vue-cli・生成された「exprice」
開始するには：---------------------このサービスを開始する方法
cd exprice- ----------------------実際のプロジェクトパス
npm installに切り替えます ------------------- ----- npm
npm run dev をインストール --------------------------プロジェクトを開始するコマンド
2.プロンプトのcdコマンドに従って、作成したプロジェクトディレクトリに入ります（ここに、作成したプロジェクトの名前を入力します）。
3.インストールプロジェクトは次のパッケージに依存しています。npminstall。package.jsonファイルは自動ビルドプロセスにすでに存在するため、ここに依存関係をインストールします。国内のミラーcnpmからインストールしないでください（後で多くの依存ライブラリが失われる可能性があります）が、実際に「a」時間のインストールに成功しない場合は、次を使用してください：cnpm install
4. vueルーティングモジュールvue-routerとネットワークリクエストモジュールvue-resourceをインストールします。cnpminstall vue-router vue-resource --saveと入力します。
4.作成された「exprice」ディレクトリは次のとおりです。
以下はpycharmによって分解されて表示されます。さまざまなディレクトリの目的を簡単に説明します。
-
プロジェクトを開始するには、次のように入力します。npm run devサービスが正常に開始された後、ブラウザーは以下に示すように、デフォルトで「ウェルカムページ」を開きます。
これまでのところ、シンプルなプロジェクトが構築されています！！！！
注：これは、サービスによって開始されるデフォルトのポート8080です。そのため、ポート8080が他のプログラムによって占有されていないことを確認してください。
元のソース：https://www.cnblogs.com/Hei-Tao-K/p/10208654.html