前期準備 vue 2.9的配置：http://blog.csdn.net/superkm/article/details/79533783
需要準備的環境和工具都準備好，接下來就開始使用vue-cli來構建項目。
在硬盤上找一個文件夾放工程用的。這裏有兩種方式指定到相關目錄：①cd 目錄路徑 ②如果以安裝git的，在相關目錄右鍵選擇Git Bash Here
打開命令終端，通過webpack工具新建vue項目（方便最終打包使用）：
vue init webpack vueFirst ，注意這裏的“vueFirst” 是項目的名稱可以說是隨便的起名，但是需要主要的是“不能用中文”。
例：
vue init webpack vueFirst ---------------------在E盤創建了vueFirst的項目
? Project name (vueFirst) vue ---------------------項目名稱
? Project description (A Vue.js project) first vue project ---------------------項目描述
? Author super --------------------- 項目創建者
? Vue build (Use arrow keys) 直接回車 出現 ? Vue build standalone
? Install vue-router? (Y/n) y --------------------- 是否安裝Vue路由，通過路由控制頁面跳轉
? Use ESLint to lint your code? (Y/n) n ---------------------是否啓用eslint檢測規則，這裏個人建議選no
? Setup unit tests? (Y/n) y ---------------------是否安裝程序的單元測試
? Pick a test runner? 回車默認 ---------------------選擇一個測試工具
? Setup e2e tests with Nightwatch? (Y/n) y
然後會問你是否使用npm進行安裝剛的配置，回車默認即可。
如果已經配置好vscode，可以直接跳過下面四步
項目搭建完成後，接下在下載安裝開發工具，這裏推薦使用 Visual Studio Code
下載安裝完成之後，進行vue在vscode裏的配置
第一步，要支持 vue 文件的基本語法高亮
在擴展商店中選擇使用 vetur
安裝完 vetur 後還需要加上這樣一段配置下：
選擇 文件>首選項>設置 在最右側 用戶設置中加入以下代碼
"emmet.syntaxProfiles": {
"vue-html": "html",
"vue": "html"
},
第二步，支持 vue 文件的 ESLint
ESLint 有很多規範是幫助我們寫出更加優雅而不容易出錯的代碼的。
ESLint 不是安裝後就可以用的，還需要一些環境和配置：首先，需要全局的 ESLint , 如果沒有安裝可以使用 cnpm install -g eslint 來安裝。其次，vue文件是類 HTML 的文件，爲了支持對 vue 文件的 ESLint ，需要 eslint-plugin-html 這個插件。可以使用 cnpm install -g eslint-plugin-html 來安裝接着，安裝了 HTML 插件後，還需要在 vscode 中配置下 ESLint：
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "vue",
"autoFix": true
}
],
"eslint.options": {
"plugins": ["html"]
},
進行 eslint --init 的依賴安裝
會安裝以下依賴
eslint-config-standard@latest
eslint-plugin-import@>=2.2.0
eslint-plugin-node@>=5.2.1
eslint-plugin-promise@>=3.5.0
eslint-plugin-standard@>=3.0.0
同時在項目目錄下生成.eslintrc.js文件。裏面只有最基本的內容：
module.exports = {
"extends": "standard"
};
表明我們使用的規則是standard規範所定義的規則。
2. 然後本地安裝最新的eslint
npm i -D eslint
- 在
package.json的scripts中添加一行：
"lint": "eslint --ext .js,.vue src"
運行：
npm run lint
VS Code會提示我們找不到eslint-config-standard： 
安裝它：
npm i -D eslint-config-standard
然後運行
npm run lint
這時就會有報錯的提示了
最後，別忘了在項目根目錄下創建 .eslintrc.json
第三步，更換vscode的文檔圖標
打開剛剛搭建的項目
會發現文檔目錄結構不是很美觀
爲了瀏覽方便，下載VsCode中的圖標插件 vscode-icons , 可以控制vscode中的文件管理的樹目錄顯示圖標
是不是好看多了 : )
第四部，添加代碼自動補全插件
搜索 vue 2 snippets，選擇安裝更新
開始運行vue項目
一定要 cd 命令進入創建的工程目錄
安裝項目依賴：因爲自動構建過程中已存在package.json文件，所以這裏直接安裝依賴就行。要從國內鏡像cnpm安裝，cnpm install
安裝 vue 路由模塊 vue-router 和網絡請求模塊 vue-resource，輸入：cnpm install vue-router vue-resource --save。
簡單的說明下各個目錄都是什麼：
啓動項目，輸入：npm run dev。服務啓動成功後瀏覽器會默認打開一個“歡迎頁面”，如下圖：
注意：這裏是默認服務啓動的是本地的8080端口，所以請確保你的8080端口不被別的程序所佔用。
至此簡單的一個項目構建完畢
