歡迎來前群裡探討技術QQ:454891743

1.安裝node.js(http://www.runoob.com/nodejs/nodejs-install-setup.html)

2.基於node.js,利用淘寶npm映象安裝相關依賴

 在cmd裡直接輸入： npm install -g cnpm --registry=https://registry.npm.taobao.org，回車，等待安裝...(windows使用管理員身份進行安裝)

3.安裝全域性vue-cli腳手架,用於幫助搭建所需的模板框架

在cmd裡 1)輸入：cnpm install -g vue-cli，回車，等待安裝...

            2).輸入：vue，回車，若出現vue資訊說明表示成功

4.建立專案

在cmd裡輸入：vue init webpack vue_test(專案資料夾名)，回車，等待一小會兒，依次出現‘git’下的項，可按下圖操作

5.安裝依賴

在cmd裡  1).輸入：cd vue_test（專案名），回車，進入到具體專案資料夾

             2).輸入：npm install，回車，等待一小會兒

回到專案資料夾，會發現專案結構裡，多了一個node_modules資料夾（該檔案裡的內容就是之前安裝的依賴）

基於腳手架建立的預設專案結構如下圖所示：

6.測試環境是否搭建成功

方法1：在cmd裡輸入：npm run dev

方法2：在瀏覽裡輸入：localhost:8080(預設埠為8080)

執行起來後的效果如下圖所示：

 問題：

在安裝過程中，你可能會遇到這個問題.

當我們執行某個專案是 會提示

> [email protected] dev C:\Users\ASUS\my-project
> node build/dev-server.js


To use this template, you must update following to modules:

  npm: 2.15.9 should be >= 3.0.0

這是隻有升級npm

即是 ：使用 npm -g install [email protected] （版本號2.9.1 可以根據已釋出的版本隨意升級或降級），獲取最新版本的npm 檔案

檢視版本：

這時在專案中進行  npm run dev 時還是會 提示

因此還有一部關鍵的一步：

複製C:\Users\{你的Windows使用者名稱}\AppData\Roaming\npm\node_modules\npm下的檔案到你的 NodeJS安裝目錄下的 \node_modules\npm 中，覆蓋掉原有的全部檔案

最後執行  npm run  dev 成功執行