Vue 2.x windows環境下安裝
阿新 • • 發佈:2021-07-15
一.安裝node(vue-cli需要)
- 如果是乾淨環境的話,可以直接下載安裝 官網地址:https://nodejs.org/zh-cn/ 推薦下載穩定版
- 如果不確定是否安裝過的話,在cmd中輸入node -v 檢視node的版本
- 預設安裝,可以修改安裝位置,不一定要在C盤下
- 預設的全域性安裝包,存放的位置在:C:\Users\使用者名稱\AppData\Roaming\npm。
注意:存放在C盤下,可能空間不夠,可以通過npm config set 來修改
方法如下:
npm config set prefix "D:\nodejs\npm"
npm config set cache "D:\nodejs\npm_cache"
修改以上內容後,需要重新修改一下環境變數
將使用者變數中的path 中的 C:\Users\AMY\AppData\Roaming\npm 修改為 D:\nodejs\npm
二.安裝vue(建議使用管理員模式 啟動cmd)
- 安裝完node後,自動安裝npm,在cmd中輸入npm -v 檢視npm的版本,使用node 安裝vue-cli
- 在cmd中輸入npm install -global vue-cli
- 安裝以後應該是vue的2.9.6版本,在cmd中輸入vue -V 檢視vue-cli的版本
注意:用Power Shell 開啟會有這個錯誤
vue : 無法載入檔案 \Node.js\node_global\vue.ps1。未對檔案 \Node.js\node_global\vue.ps1 進行數字簽名。無法在當前系統上執行該指令碼
需要在power shell 裡面set-ExecutionPolicy RemoteSigned
三.安裝vscode
- 瀏覽器開啟官網 https://code.visualstudio.com/ 點選主介面上的按鈕 下載
注意:有時候,可能出現使用chrome瀏覽器,官網下載過慢的問題。
解決方法:修改vscode的下載地址的映象為國內映象,
例如:chrome 下載內容中的地址為:
https://az764295.vo.msecnd.net/stable/cfa2e218100323074ac1948c885448fdf4de2a7f/VSCodeUserSetup-x64-1.56.0.exe
將 az764295.vo.msecnd.net 修改為vscode.cdn.azure.cn 即
https://vscode.cdn.azure.cn/stable/cfa2e218100323074ac1948c885448fdf4de2a7f/VSCodeUserSetup-x64-1.56.0.exe
四.安裝vscode外掛
參考連結 https://zhuanlan.zhihu.com/p/347926284
自己使用中用到的比較多的
- Chinese (Simplified) Language Pack for Visual Studio Code VSCODE漢化包(有時候,可能自己就安裝了)
- Vetur VSCODE Vue工具包
- Auto Complete Tag 自動重新命名和關閉標籤(這個會自動安裝 Auto Rename Tag 和Auto Close Tag)
- Path Intellisense 路徑自動補全
- JavaScript(ES6) code snippets 自動補全ES6語法
- Bracket Pair Colorizer 括號自動配對
- Live Server (誰用誰知道)
- open in browser
- Drink water reminder