目錄
什麼是vue-cli
主要的功能
需要的環境
Node.js : http://nodejs.cn/download/
Git : https://git-scm.com/downloads
安裝 Node.js 淘寶鏡像加速器（cnpm），這樣子的話,下載下傳會快很多~
安裝 vue-cli
第一個 vue-cli 應用程式
建立Vue項目目錄，并在指令行進入目錄
建立一個基于 webpack 模闆的 vue 應用程式
初始化并運作
Vue-cli目錄結構
index.js
src 目錄
main.js
App.vue
vue-cli 官方提供的一個腳手架,用于快速生成一個 vue 的項目模闆;
預先定義好的目錄結構及基礎代碼，就好比咱們在建立 Maven 項目時可以選擇建立一個骨架項目，這個骨架項目就是腳手架,我們的開發更加的快速;
統一的目錄結構
本地調試
熱部署
單元測試
內建打包上線
安裝就無腦下一步就好,安裝在自己的環境目錄下
鏡像:https://npm.taobao.org/mirrors/git-for-windows/
确認nodejs安裝成功:
cmd 下輸入 node -v,檢視是否能夠正确列印出版本号即可!
cmd 下輸入 npm-v,檢視是否能夠正确列印出版本号即可!
npm,就是一個軟體包管理工具
安裝過程可能有點慢~,耐心等待!雖然安裝了cnpm,但是盡量少用，有可能會出錯，npm慢的時候再用
一路都選擇Yes即可；學習的時候可以從vue-router開始都選擇No；
說明:
Project name：項目名稱，預設 回車 即可
Project description：項目描述，預設 回車 即可
Author：項目作者，預設 回車 即可
Install vue-router：是否安裝 vue-router，選擇 y 安裝
Use ESLint to lint your code：是否使用 ESLint 做代碼檢查，選擇 y 安裝
Set up unit tests：單元測試相關，選擇 y 安裝
Setup e2e tests with Nightwatch：單元測試相關，選擇 y 安裝
Should we run npm install for you after the project has been created：建立完成後直接初始化，選擇 n，我們手動執行;運作結果!
執行完成後,目錄多了很多依賴 node_modules
安裝并運作成功後在浏覽器輸入：http://localhost:8080
用IDEA打開myvue
build 和 config：WebPack 配置檔案
node_modules：用于存放 npm install 安裝的依賴檔案
src： 項目源碼目錄
static：靜态資源檔案
.babelrc：Babel 配置檔案，主要作用是将 ES6 轉換為 ES5
.editorconfig：編輯器配置
eslintignore：需要忽略的文法檢查配置檔案
.gitignore：git 忽略的配置檔案
.postcssrc.js：css 相關配置檔案，其中内部的 module.exports 是 NodeJS 子產品化文法
index.html：首頁，僅作為模闆頁，實際開發時不使用
package.json：項目的配置檔案
name：項目名稱
version：項目版本
description：項目描述
author：項目作者
scripts：封裝常用指令
dependencies：生産環境依賴
devDependencies：開發環境依賴
src目錄是項目的源碼目錄，所有代碼都會寫在這裡
項目的入口檔案，我們知道所有的程式都會有一個入口
import Vue from 'vue'：ES6 寫法，會被轉換成 require(“vue”); （require 是 NodeJS 提供的子產品加載器）
import App from './App'：意思同上，但是指定了查找路徑，./ 為目前目錄
Vue.config.productionTip = false：關閉浏覽器控制台關于環境的相關提示
new Vue({...})：執行個體化 Vue
el: '#app'：查找 index.html 中 id 為 app 的元素
template: ''：模闆
components: { App }：引入元件，使用的是 import App from ‘./App’ 定義的 App 元件