1. 程式人生 > 其它 >Vue 2.x windows環境下安裝

Vue 2.x windows環境下安裝

一.安裝node(vue-cli需要)

  1. 如果是乾淨環境的話,可以直接下載安裝 官網地址:https://nodejs.org/zh-cn/ 推薦下載穩定版
  2. 如果不確定是否安裝過的話,在cmd中輸入node -v 檢視node的版本
  3. 預設安裝,可以修改安裝位置,不一定要在C盤下
  4. 預設的全域性安裝包,存放的位置在: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)

  1. 安裝完node後,自動安裝npm,在cmd中輸入npm -v 檢視npm的版本,使用node 安裝vue-cli
  2. 在cmd中輸入npm install -global vue-cli
  3. 安裝以後應該是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

  1. 瀏覽器開啟官網 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

自己使用中用到的比較多的

  1. Chinese (Simplified) Language Pack for Visual Studio Code VSCODE漢化包(有時候,可能自己就安裝了)
  2. Vetur VSCODE Vue工具包
  3. Auto Complete Tag 自動重新命名和關閉標籤(這個會自動安裝 Auto Rename Tag 和Auto Close Tag)
  4. Path Intellisense 路徑自動補全
  5. JavaScript(ES6) code snippets 自動補全ES6語法
  6. Bracket Pair Colorizer 括號自動配對
  7. Live Server (誰用誰知道)
  8. open in browser
  9. Drink water reminder