VUE-CLIは何ですか
すぐに使用公式によって提供さヴュー-cliの足場は、プロジェクトテンプレートVUEを生成します
事前定義されたディレクトリ構造と基礎となるコード、あなたはMavenプロジェクトは、スケルトンプロジェクトを作成するかを選択することができます作成するときに、このプロジェクトは、足場スケルトン、私たちのより急速な発展であるように
主な機能
- 統一されたディレクトリ構造
- ローカルデバッグ
- ホット・デプロイ
- ユニットテスト
- 統合されたオンラインのパッケージ
環境ニーズ
- Node.jsの： http://nodejs.cn/download/
、同様に、独自の環境ディレクトリにインストールされていない次の脳へのインストール
インストールが成功したのnodejsを確認
- CMDの下の入力が
node -v正しく、この数の公表をすることができ印刷できる場合は、参照してください！ - CMDの下の入力が
npm-v正しく、この数の公表をすることができ印刷できる場合は、参照してください！
このNPM、パッケージ管理ツールであり、aptとソフトウェアは、Linuxの下で、ほとんどのインストール
淘宝ミラーが設置Node.jsの促進剤（cnpm）
＃ - Gはグローバルにインストールされ
CNPMインストールNPM -gを
設置場所： C:\Users\Administrator\AppData\Roaming\npm
インストールVUE-CLI
CNPMのVUE-CLI -gインストール
インストールが成功したかどうか＃テストを
VUEリスト
環境がインストールさ - VUE-CLIアプリケーションを作成する - ポイントを取得します
- あなたはVueのプロジェクトを作成する前に、ちょうどあなたのコンピュータ上に空のフォルダを作成してみましょう。このフォルダはVUE-CLIプロジェクトを保存するために使用されます。管理を容易にするために
、端末を開くには、管理者cmdを使用して、フォルダを作成した後、このディレクトリに、次の操作を行います - テンプレートのWebPACKに基づいてアプリケーションを作成VUE
＃Myvueここに名前を付けることができ、ニーズに応じて、プロジェクトの名前である 資本を持っていない＃プロジェクト名、このプロジェクトは、現在のCMD端子にフォルダのパスを生成しますが配置されている VUEのinit WebPACKのmyvue
説明：
- プロジェクト名：プロジェクト名、デフォルトにEnterキーを押します
- プロジェクトの説明：プロジェクトの説明、デフォルトの入力し、Enterキーを押します
- 著者：著者のプロジェクトは、デフォルトの入力し、Enterキーを押します
- （：コンパイラと実行環境をインストールし、ここで最新バージョンを1つの以上のステップは、最初のオプションを選択します）
- VUE-ルータをインストールします。VUE-ルータを設置している、（手動後半を追加する必要があります）をインストールしないことを選択したn個
- あなたのコードをlintの使用ESLint：ESLintは、コード検査を行う使用するかどうかを、n個（手動で追加する後者の必要性）をインストールしないことを選択
- ユニットテストセットアップ：関連のユニットテストを、インストールしないことを選択N（後者必要が手動で追加されます）
- ナイトウォッチでセットアップE2Eテスト：ユニットテストの関連は、インストールしないことを選択したn個（手動後半を追加する必要があります）
- 私たちは、プロジェクトが作成された後、あなたのためにインストールNPM実行する必要があります：直接の初期化を作成するために完了し、Nを選択し、我々は手動で行われ、オペレーティング結果を！
初期化と実行
＃次のプロジェクト作成されたディレクトリに進み
CD myvue
＃初期
NPMインストール
＃スタートVUE-CLIプロジェクト
NPMの実行DEVを
：インストールと入力し、ブラウザで正常に実行した後、HTTP：// localhostを：8080
Vueの-cliのディレクトリ構造
- ビルドと設定：WebPACKのプロフィール
- node_modules：依存関係をインストールNPMストアのインストールに使用
- SRC：ソースディレクトリプロジェクト
- 静的：静的リソースファイル
- .babelrc：バベルプロファイルは、主な役割は、ES5 ES6を変換することです
- .editorconfig：設定エディタ
- eslintignore：文法チェッカープロファイルを無視する必要があります
- .gitignore：gitのは、プロファイルを無視します
- .postcssrc.js：css 相关配置文件，其中内部的 module.exports 是 NodeJS 模块化语法
- index.html：首页，仅作为模板页，实际开发时不使用
-
package.json：项目的配置文件
- name：项目名称
- version：项目版本
- description：项目描述
- author：项目作者
- scripts：封装常用命令
- dependencies：生产环境依赖
- devDependencies：开发环境依赖
src 目录
src 目录是项目的源码目录，所有代码都会写在这里
main.js
项目的入口文件，我们知道所有的程序都会有一个入口
App.vue
在 vue 中，每个 以 .vue 结尾的文件称为 单文件组件，本质上和 Vue.component("name",{ ...... }); 这样定义一个组件没有什么区别