1.安裝Node.js
安裝包下載地址： https://nodejs.org/en/
安裝時可以選擇是否自動安裝必要的工具，如Chocolatey、Python2，這里我選擇了自動安裝
Node.js安裝結束后，打開cmd輸入 node -v ，回車，會輸出node的版本號則表示Node.js安裝成功，
2.設定Node.js prefix（全域）和cache（快取）路徑
在nodejs安裝路徑下，新建node_global和node_cache兩個檔案夾
設定快取檔案夾
npm config set cache "C:\Program Files\nodejs\node_cache"
設定全域模塊存放路徑
npm config set prefix "C:\Program Files\nodejs\node_global"
設定成功后，之后用命令npm install XXX -g安裝以后模塊就在C:\Program Files\nodejs\node_global里
3.安裝cnpm鏡像
npm install -g cnpm --registry=https://registry.npm.taobao.org
4.設定環境變數
系統變數添加NODE_PATH，路徑：C:\Program Files\nodejs\node_global\node_modules
修改用戶變數中path，添加路徑C:\Program Files\nodejs\node_global
驗證環境變數
node -v
npm -v
cnpm -v
若上述命令均能成功顯示版本資訊，環境變數設定成功，
遇到如下錯誤資訊
需要輸入如下陳述句解決：
set-ExecutionPolicy RemoteSigned
在提示選單選擇時選擇A或者Y，再次輸入cnpm -v成功顯示版本資訊，
? 
5.安裝vue和vue-cli
cnpm install vue -g
cnpm install vue-cli -g
6.新建專案并運行測驗
a.) cmd進入D:/Vue
b.) vue init webpack-simple demo
?
c.) 進入專案目錄 cd demo
d.) 安裝專案需要的依賴 npm install
此時會出現安裝node-sass失敗的錯誤提示，解決辦法如下：
1）先運行： npm install -g node-gyp
2）然后運行：運行 npm install --global --production windows-build-tools 可以自動安裝跨平臺的編譯器：gym
3）執行npm uninstall node-sass，清除安裝錯誤的快取
4）執行npm install node-sass重新安裝node-sass
5）重新執行npm install
e.) 運行專案 npm run dev
瀏覽器中http://localhost:8080/顯示vue頁面則表明vue開發環境安裝成功
7.安裝開發工具VS Code
安裝包下載地址： https://code.visualstudio.com/Download
VS Code開發Vue Project時常用插件
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/31361.html
標籤：HTML5
上一篇：vue 實作 rem 布局的 或者 vw 布局的方法
下一篇：HTML5實作無重繪修改URL