vue版本：2.2.2
1.全域性安裝vue命令列工具
npm install -g vue-cli
2.建立乙個基於webpack模板的新專案
vue init webpack my-project
注：跟「npm init」類似，輸入一系列專案描述與配置，可以不用配置eslint和單元測試框架。
3.專案建立完成後再安裝基礎模組
cd my-project
npm install
注：第一次安裝了單元測試框架，結果安裝到27%就安裝不下去了，然後顯示失敗。第二次我把單元測試框架也去掉了，很快便安裝完了。
4.安裝完成後執行該專案即可。
npm run dev
專案監聽在8080埠，出現頁面即為成功。
下圖為安裝eslint和單元測試框架後的檔案結構 .
|-- build
// 專案構建相關**
| |-- build
.js// 生產環境構建**
| |-- check-version
.js// 檢查 node、npm 等版本
| |-- dev-client
.js// 熱過載相關
| |-- dev-server
.js// 構建本地伺服器
| |-- utils
.js// 構建工具相關
| |-- webpack
.base
.conf
.js// webpack 基礎配置（出入口和 loader）
| |-- webpack
.dev
.conf
.js// webpack 開發環境配置
| |-- webpack
.prod
.conf
.js// webpack 生產環境配置
|--
config
// 專案開發環境配置
| |-- dev
.env
.js// 開發環境變數
| |-- index
.js// 專案一些配置變數（開發環境介面**將在此配置）
| |-- prod
.env
.js// 生產環境變數
| |-- test
.env
.js// 測試環境變數
|-- src
// 原始碼目錄
| |-- components
// vue 公共元件
| |-- store
// vuex 的狀態管理
.vue
// 頁面入口檔案
| |-- main
.js// 程式入口檔案，載入各種公共元件
|--
static
// 靜態檔案，比如一些，json資料等
|-- test
// 自動化測試相關檔案
|--
.babelrc
// es6語法編譯配置
|--
.editorconfig
// 定義**格式
|--
.eslintignore
// eslint 檢查忽略的檔案
|--
.eslistrc
.js// eslint 檔案，如需更改規則則在此檔案新增
|--
.gitignore
// git 上傳需要忽略的檔案
|-- readme
.md// 專案說明
|-- index
.html
// 入口頁面
|--
package
.json
// 專案基本資訊.
當專案需要發布時，執行 npm run build命令來打包專案，打包後的存放在dist資料夾下。dist下的頁面不能以檔案的方式開啟，需要通過發布後才能訪問。
ps:第一次打包後，啟動服務執行結果發現找不到相關的js和css，檢查後發現dist前面多了一條「/」，所以需要在config/index.js裡修改
將assetspublicpath的值設為『』；
使用vue2 0建立的專案的步驟
檢查是否有node.js npm vue win r 輸入cmd 輸入node v 回車 會出現node,js的版本 輸入npm v 回車 會出現npm的版本 輸入vue v 回車 會出現vue的版本 2.安裝vue plain view plain copy npm install g vue c...
vue建立新專案
新建乙個資料夾，在該資料夾路徑下開啟終端 1 vue init webpack test test 是新建的專案名稱，自己定義 2 project name test project description a vue.js project author vue build standalone i...
使用VUE2 0構建webpack專案
1 vue構建webpack專案需要依賴於node 和npm 需要先安裝。輸入node v回車 會出現node版本號 輸入npm v回車 會出現npm版本號 2 安裝vue npm install g vue cli g表示全域性安裝，vue cli是模組 或者使用 映象 npm install r...