あなたは、(a)はVUEの背景管理システムを開発し教え:VUEは、環境を構築します

まず、VUEは何ですか

      【公式説明は】ヴュー(発音/vjuː/は、ビューと同様)は、ユーザインタフェースを構築するためのプログレッシブフレームです。他のフレームの差が大きい、Vueのは、層によってアップ底層から印加されるように設計されています。Vueのコアライブラリのビュー層にのみ焦点を当て、使いやすいだけでなく、サードパーティ製のライブラリまたは既存のプロジェクトを統合することは容易ではないだけです。一方、現代のツールチェーンとさまざまなサポート・ライブラリーを組み合わせて使用、複雑な1ページのアプリケーションのためにドライブを提供することも十分に可能ヴュ。

       :詳細については、VUEの公式ウェブサイトをご参照ください https://cn.vuejs.org/v2/guide/#      ビデオ教材としてだけでなく、今の公式サイトを

第二に、なぜVUEを学ぶ必要があります

        過去には、業務管理手順の開発はMVCアーキテクチャで使用されている、フロントエンドVは、一般的にだけで、バックエンドの制御終了の強い依存性を示し、開発者のいずれかの需要は、個別の前後、またはフロントエンド、バックエンドの開発から開発してきました徐々に別々のフロント及び方法の後端、良好な前後端定義されたインタフェースへと発展が、前端と後端をしっかりと結合され、フロントおよびバックエンド開発者はしばしば相互に待たなければならない、アプリケーションが別々に展開することができないために、これらの問題を解決するために、何の柔軟性が、存在しません、相互に依存した後、あなたは、開発、デバッグ、非常に便利と柔軟性を高め、展開を分離することは非常に容易に分離することができます。もちろん、VUEは、以前の開発アプローチに直接埋め込むことができますが、一般的にはお勧めできません。

        私はあなたがVUE + SpringBoot + SpringSecurity + MyBatisの+ MySQLのフロントと分離ベースの管理システムの後端を開発持参するブログ記事のシリーズを書くことを計画、これは前部のブログシリーズです。

第三に、VUE環境を構築

       1、ノードをインストール

            VUEの操作が実装するノードのNPM管理ツールに依存しているので、あなたに、ノードをインストールする必要があります最初のステップhttp://nodejs.cn/download/自分のWindowsオペレーティングシステムに応じて、公式サイトには、32または64であります以下に示すようにビットが、窓にcmdを実行し、パスに追加し、Windowsの環境変数のディレクトリ・パス、ディレクトリに直接、私はzipファイルをダウンロードするために使用される、解凍ダウンロードして、適切なバージョンを選択しますコマンドライン、入力ノード-vに、以下に示すように、インストールが成功したことを意味するノードのバージョンを表示します。

 

 

        2、VUE-CLIを取り付けます

             VUE-CLIは、当時の新しいプロジェクトが必要とされていないので、VUE-CLIをインストールしておく必要があります前に、プロジェクトをビルドするために、WebPACKのをVUEテンプレートプロジェクト、このテンプレートに基づいて、我々のプロジェクトの開発プロジェクトのフェーズに基づいています。

             Windowsのコマンドラインで次のコマンドを実行します。NPM VUE-CLI -gをすることができ、インストールします。

        3、新規プロジェクト

              最初のWindowsフォルダにプロジェクトを作成し、Windowsのコマンドラインで、このディレクトリを入力し、次のコマンドを実行します。vue init webpack,然后根据提示输入项目名等,如下图:

 

     4、インストールプロジェクトの依存関係

          (プロジェクトディレクトリの下の)Windowsのコマンドラインで続行:NPM注意をインストールします。実行するために必要とされているノードの古いバージョンを使用している場合は、新しいノードのバージョンは、このコマンドを実行する必要はありません。

     5、プロジェクトを実行

          (プロジェクトディレクトリの下に)Windowsのコマンドラインで続行:次の図の操作が成功した後、DEV実行NPM、オープンIEを入力します。http:// localhost:8080をII下記参照、プロジェクトを開くには: 

            注:以下のスローガンチャートは自動的に特定のポートである、8081の数字になるので、私は、VUEのプロジェクトを開いているので、我々は図の赤枠の部分を見ることができます

             

 

                                                                                                                    図I

                                                                                                    図II

第四に、開発ツールのインストール

      理論的に構築されたVUEは、開発に任意のテキストファイルの開発ツールを使用することができますが、良いツールがより効果的にすることができ、私はVSCodeを使用することをお勧めし、ブラウザに入力しhttps://code.visualstudio.com/  、適切なバージョンのダウンロードを選択しますインストールされています。インストールオープンvscodeした後、[開く]フォルダを選択し、自分のプロジェクトフォルダを選択し、[ファイル]メニューの[プロジェクトのすべてのオープンソースコードを見ることができます。

 

おすすめ

転載: www.cnblogs.com/hugo123/p/11409253.html