この章では、主に完全なプロジェクト開発環境を構築する方法について説明します
1つは、vueスキャフォールディングをインストールする
最初にフォルダーを作成し、このフォルダーの黒いウィンドウにVueスキャフォールディングをインストールし（cmdコマンドで入力）、次のコマンドを使用してインストールします：cnpm i -g @ vue / cliコマンド
インストールが成功したかどうかを確認します。vue--versionコマンド
次に、フロントエンドのvueプロジェクトの作成
- フロントエンドプロジェクトフォルダを作成しますvuecreateプロジェクト名
例：vue create kigo-web
2. Man ...（手動インストール）を
選択します3.必要なスタイルを選択します
4. 2.0xを使用します
5.ルーターに履歴モードを使用しますか？ （履歴モードを使用しますか？）
返信yはい
6. Sass / SCSS（node-sassあり）モードを
選択します7. In package.josnを選択します
8.テンプレートを保存して返信するかどうかn（いいえ）
9。インストールを待ちます、インストールが完了するのを待ち、プロジェクトディレクトリにcdします。例：cd kigo-web、プロジェクトディレクトリに入った後にコマンドcnpm i axios --saveを実行します。このコマンドは、ajaxリクエストを送信するために使用されます。10.次のような必要なUIコンポーネントライブラリをインストールします：cnpm i element-ui --save、cnpm i vant --save
3つのバックエンドプロジェクトの作成
1.プロジェクトディレクトリで黒いウィンドウを開きます
expresskigo-adminなどのエクスプレスプロジェクト名- cd kigo-admin
进入kigo-admin之内 - cnpm iコマンドを実行して、すべての依存関係をインストールします
- cnpm i mongoose --saveコマンドを実行して、データベースを操作します
- cnpm i cors--saveクロスドメインの問題を解決する
プロジェクト全体が完了したら、一部の構成を変更する必要があり
ます1.「start」のノードをバックエンドpackage.jsonのnodemonに変更します
2.バックエンドapp.jsファイルにcorsを導入して、クロスドメインを解決します問題
これまでのところ、プロジェクト開発の準備作業は完了しており、フロントエンドとバックエンドのコマンドウィンドウから開始できます。フロントエンドはコマンドnpm runserveを実行し、バックエンドはコマンドnpstartを実行します。
プロジェクトを整理する時が来ました
フロントエンドプロジェクトの仕上げ：
- 最初にエディターでフロントエンドフォルダーを開きます。最初にApp.vueのすべてのコンテンツを削除してから、vueテンプレートを入力し、divを作成し、helloを書き込んでテストします。
- 次に、ビューの下にあるすべてのページを削除します
- 削除されたルーターの内容を図に示します。
- コンポーネント（主キー）のコンテンツも削除されます
- main.jsにelement-uiとvantuiをインポートし、グローバル登録にaxiosを使用します。
- main.jsの構成が完了したら、axiosを直接使用する必要があります。$ axiosは将来使用できます。
バックエンドプロジェクトの整理
- ルートのindex.jsの内容を変更するだけです
