NVM 安裝 （Windows版本）

  • 一、NVM 介紹
  • 1. 什麼是 NVM
  • 2. NVM、Node.js 與 NPM 的關係
  • 二、NVM 的下載與安裝（Windows版本）
  • 步驟1. 下載渠道（官方安全）
  • 步驟2. 配置 NPM 項目加速鏡像
  • 步驟3. 配置 NVM 鏡像
  • 步驟4. 配置全局共享 NPM
  • （1）如何配置全局共享 NPM（看需）
  • （2）取消全局共享 NPM（看需）
  • 三、Node 版本切換的注意事項
  • 場景一：重新安裝項目依賴
  • 場景二：檢查並補裝全局包
  • 場景三：清理 NPM 緩存（必要時）
  • 四、解決全局包版本和某 Node 版本不兼容的方法
  • 臨時解決
  • 長期解決
  • 五、擴展
  • 一、NPM 的默認全局安裝目錄
  • 二、NPM 的默認緩存安裝目錄
  • 三、NPM 的本地安裝（不加 -g）與全局安裝（加 -g）

一、NVM 介紹

1. 什麼是 NVM

NVM 全稱為 Node Version Manager，在 Windows 系統中特指 nvm-windows——一款專門用於管理多 Node.js 版本的工具。

其核心價值是解決 Windows 下“不同項目依賴不同 Node.js 版本”的衝突問題：例如同時開發老項目（需 Node 16）與新項目（需 Node 18）時，無需手動卸載舊版本、修改系統環境變量，僅通過命令即可實現 Node 版本的一鍵切換，確保各項目環境獨立且穩定。

2. NVM、Node.js 與 NPM 的關係

三者在 Windows 環境下呈“層級綁定”關係，邏輯清晰且聯動緊密，具體如下：

  • NVM（nvm-windows）：頂層版本管理者，負責 Node.js 版本的“安裝、切換、卸載”。
    例如：通過 nvm install 18 安裝 Node 18，通過 nvm use 16 切換到 Node 16，不直接參與代碼運行或包管理。
  • Node.js：底層運行環境，是執行前端代碼（如 Vue、React 項目）的核心。
    每個 Node.js 版本在 Windows 中對應獨立文件夾（如 D:\Nvm\versions\node\v16.18.0），不同版本互不干擾。
  • NPM：Node.js 自帶的包管理工具，每個 Node.js 版本會自動附帶匹配的 NPM 版本（如 Node 16 綁定 NPM 8，Node 18 綁定 NPM 9）。
    當 NVM 切換 Node 版本時，NPM 會自動同步切換（例如切到 Node 18 後，npm -v 會顯示 9.x），無需額外配置。

實操案例：
通過 NVM 安裝 Node 16 和 18 後，執行 nvm use 16 會自動調用 Node 16 及配套的 NPM 8；
執行 nvm use 18 則切換為 Node 18 及配套的 NPM 9，三者一一對應，避免版本混亂。

二、NVM 的下載與安裝（Windows版本）

Windows 需使用 nvm-windows 工具，需從官方渠道下載並按規範安裝，步驟如下：

步驟1. 下載渠道（官方安全）

  • 官方下載地址：GitHub nvm-windows Releases 頁面
  • 推薦版本：選擇 nvm-setup.zip （安裝包版），目前此處版本為1.2.2

    • nvm安裝（Windows篇）_三虎的技術博客_#1024程序員節

（1）安裝步驟（關鍵注意事項）

  1. 解壓下載的 nvm-setup.zip，雙擊 nvm-setup.exe 啓動安裝，同意協議後選擇 NVM 安裝目錄（如 D:\Nvm），嚴禁選擇含空格/特殊字符的路徑（如 C:\Program Files，會導致 Node 安裝失敗）。
  2. 下一步設置 Node.js 快捷方式目錄（如 D:\NodeJs），此目錄為 Windows 系統調用 Node 的“入口路徑”，需與 NVM 安裝目錄分開且為空。
  3. 點擊“Install”完成安裝，NVM 會自動配置 NVM_HOME（NVM 安裝目錄）和 NVM_SYMLINK（Node 快捷方式目錄）環境變量，無需手動添加。

（2）安裝驗證
打開 新的 CMD/PowerShell 窗口（舊窗口不加載新環境變量），執行以下命令：

# 查看 NVM 版本，顯示版本號（如 1.1.10）即安裝成功
nvm version
# 查看本地已安裝的 Node 版本（初始為空）
nvm ls

步驟2. 配置 NPM 項目加速鏡像

NPM 默認從國外官方鏡像下載項目依賴，Windows 下易因網絡問題導致超時，需配置國內加速鏡像（npmmirror，原淘寶鏡像）

（1）核心鏡像信息

  • 原鏡像（默認）：https://registry.npmjs.org/（服務器位於國外，下載 vue、axios 等包時易出現“ETIMEDOUT”超時錯誤）；
  • 加速鏡像：https://registry.npmmirror.com/（國內鏡像，10 分鐘同步一次官方倉庫，Windows 下下載速度可從“幾十 KB/s”提升至“幾 MB/s”）。

（2）配置步驟

  1. 查詢當前鏡像：
npm config get registry

若輸出 https://registry.npmjs.org/，説明當前使用默認國外鏡像。

  1. 配置加速鏡像：
npm config set registry https://registry.npmmirror.com
  1. 驗證配置結果：
npm config get registry

若輸出 https://registry.npmmirror.com，説明配置成功。

（3）還原默認鏡像（如需）

若需切換回 NPM 官方鏡像，執行以下命令：

npm config set registry https://registry.npmjs.org/

實操案例：未配置加速鏡像時，npm install vue 需 30 秒且易超時；配置後僅需 5 秒即可完成下載，且無網絡錯誤。

步驟3. 配置 NVM 鏡像

NVM 下載 Node.js 版本時默認從國外官方鏡像獲取，Windows 下易因網絡問題導致下載緩慢或中斷，需配置國內加速鏡像，具體如下：

（1）核心鏡像信息

原鏡像（默認）：https://nodejs.org/dist/（下載 Node 安裝包時速度慢，如 Node 16 需 10 分鐘）；

加速鏡像：

  • Node 鏡像：https://npmmirror.com/mirrors/node/
  • NPM 鏡像：https://npmmirror.com/mirrors/npm/（下載 Node 時自動同步 NPM 安裝包，確保版本匹配）。

（2）配置步驟

1.找到 NVM 配置文件：打開 NVM 安裝目錄（如 D:\Nvm），找到 settings.txt 文件（文本格式）。
2.添加鏡像配置：用記事本打開 settings.txt，在文件末尾追加以下兩行：

node_mirror: https://npmmirror.com/mirrors/node/
npm_mirror: https://npmmirror.com/mirrors/npm/

3.驗證配置結果：執行以下命令下載 Node 16，觀察下載速度：

nvm install 16.18.0

配置前需 10 分鐘，配置後僅需 1 分鐘，且無中斷，説明配置成功。

步驟4. 配置全局共享 NPM

注意！！！
v1.2.2 安裝包默認實現了npm的全局共享

全局共享NPM最直觀的現象：在任意一個Node版本下全局安裝的包，切換到另一個版本後可直接使用，無需重複安裝。

優點：裝一次全局包，多版本能用
缺點：若全局包版本和某 Node 版本不兼容，切換後會直接報錯（解決方案看章節四）。

（1）如何配置全局共享 NPM（看需）

實現核心：就是把他們的全局安裝目錄統一到同一個文件
步驟如下：
1.創建統一全局目錄：如 D:\NodeGlobal；
2.給每個 Node 版本設置統一 prefix：

# 切換到 Node 16
nvm use 16
npm config set prefix D:\NodeGlobal
# 切換到 Node 18
nvm use 18
npm config set prefix D:\NodeGlobal

3.驗證配置：任意 Node 版本下執行 npm config get prefix，均輸出 D:\NodeGlobal 即成功。。

（2）取消全局共享 NPM（看需）

如果你配置了全局共享 NPM，想要為每個 npm 恢復獨立全局目錄，操作如下

針對每個 Node 版本，刪除統一prefix配置
由於prefix配置是按 Node 版本獨立存儲的（即 Node 16 和 18 的prefix是分開設置的），需要分別切換到每個版本執行刪除操作：

# 1. 切換到Node 16
nvm use 16

# 2. 刪除之前設置的統一prefix（如D:\NodeGlobal）
npm config delete prefix

# 3. 驗證是否恢復默認全局目錄
npm config get prefix
# 輸出應為Node 16的默認全局目錄，例如：
# D:\Nvm\versions\node\v16.18.0\node_global
# 1. 切換到Node 18
nvm use 18

# 2. 同樣刪除統一prefix配置
npm config delete prefix

# 3. 驗證默認目錄
npm config get prefix
# 輸出應為Node 18的默認全局目錄，例如：
# D:\Nvm\versions\node\v18.20.3\node_global

三、Node 版本切換的注意事項

場景一：重新安裝項目依賴

Node 版本切換後，項目依賴需重新下載，因不同 Node 版本對依賴的編譯格式、子版本解析規則存在差異。

案例：用 Node 16 開發“項目 A”並安裝依賴（D:\Projects\A\node_modules），切換到 Node 18 後運行 npm run dev 報錯“Cannot find module ‘xxx’”，需按以下步驟操作：

  1. 刪除項目 A 根目錄的 node_modules 文件夾和 package-lock.json 文件；
  2. 執行 npm install，重新下載適配 Node 18 的依賴；
  3. 再次執行 npm run dev，項目正常啓動。

場景二：檢查並補裝全局包

切換 Node 版本後，需確認當前版本是否已安裝所需全局包（如 vue-cli、vite），未安裝則需補裝。

案例：切換到 Node 18 後，執行 vue -V 提示“‘vue’ 不是內部或外部命令”，説明 Node 18 未安裝 vue-cli，需執行：

# 全局安裝適配 Node 18 的 vue-cli（自動下載 最新 版本）
npm install -g @vue/cli
# 驗證
vue -V  # 輸出 @vue/cli 5.x.x，説明安裝成功

場景三：清理 NPM 緩存（必要時）

切換 Node 版本後，若 npm install 提示“cache corrupted”或“invalid cache”，需清理緩存後重新安裝。

案例：切換 Node 版本後執行 npm install axios 報錯，執行 npm cache clean --force 清理緩存，再重新安裝即可解決。

四、解決全局包版本和某 Node 版本不兼容的方法

臨時解決

該方式需要頻繁卸載重裝，僅適合短期應急。

# 切換到Node 16，裝兼容版本
nvm use 16.20.2
npm uninstall -g @vue/cli
npm install -g @vue/cli@4

# 用完Node 16後，切回Node 18時，再裝回高版本
nvm use 18.20.2
npm uninstall -g @vue/cli
npm install -g @vue/cli@5

# 用完Node 18後，切回Node 16時，再裝回低版本
nvm use 16.20.2
npm uninstall -g @vue/cli
npm install -g @vue/cli@4

長期解決

恢復 “每個 Node 版本獨立的全局目錄”

# 1. 分別刪除兩個版本的共享prefix
nvm use 16.20.2
npm config delete prefix

nvm use 18.20.2
npm config delete prefix

# 2. 驗證是否恢復默認獨立目錄
nvm use 16.20.2
npm config get prefix  # 應輸出Node 16專屬目錄（如D:\Nvm\versions\node\v16.20.2\node_global）

nvm use 18.20.2
npm config get prefix  # 應輸出Node 18專屬目錄

# 3. 為兩個版本安裝專屬全局包
nvm use 16.20.2
npm install -g @vue/cli@4  # Node 16用4.x

nvm use 18.20.2
npm install -g @vue/cli@5  # Node 18用5.x

# 4. 驗證版本獨立
nvm use 16.20.2 && vue -V  # 輸出4.x
nvm use 18.20.2 && vue -V  # 輸出5.x

五、擴展

一、NPM 的默認全局安裝目錄

NPM 的“全局安裝目錄”用於存儲通過 npm install -g <包名> 安裝的“全局包”（如 vue-cli、vite）。
Windows 下分“非 NVM 環境”和“NVM 環境”兩種場景，具體如下：

（1）非 NVM 環境（單獨安裝 Node.js）

默認路徑：C:\Users<你的用户名>\AppData\Roaming\npm（例如用户名為“ZhangSan”，路徑為 C:\Users\ZhangSan\AppData\Roaming\npm）。

目錄內容舉例：

  • node_modules 文件夾：存儲全局包，如安裝 vue-cli 和 vite 後，會生成 @vue/cli、vite 子文件夾；
  • 可執行命令文件：如 vue.cmd、vite.cmd，在任意 CMD 窗口輸入 vue -V 或 vite --version 即可調用。

（2）NVM 環境（多 Node 版本管理）

默認路徑：%NVM_HOME%\versions\node\v<版本號>\node_global （例如 NVM 安裝在 D:\Nvm，Node 16 的路徑為 D:\Nvm\versions\node\v16.18.0\node_global）。

目錄內容舉例：

  • 每個 Node 版本的全局包獨立存儲：
    如給 Node 16 安裝 npm install -g @vue/cli@4，此目錄下的 node_modules 會包含 @vue/cli（4.x 版本）；切換到 Node 18 後，全局目錄變為 D:\Nvm\versions\node\v18.20.3\node_global，若未安裝 vue-cli，輸入 vue -V 會提示“‘vue’ 不是內部或外部命令”。

（3）查看當前全局安裝目錄

無論是否使用 NVM，執行以下命令即可查看當前生效的全局目錄：

npm config get prefix

二、NPM 的默認緩存安裝目錄

NPM 緩存目錄用於存儲“已下載的包壓縮包及解壓文件”，避免重複從網絡下載，Windows 下無論是否使用 NVM，緩存目錄均統一

（1）默認路徑

C:\Users<你的用户名>\AppData\Local\npm-cache （例如用户名為“ZhangSan”，路徑為 C:\Users\ZhangSan\AppData\Local\npm-cache）。

（2）目錄內容舉例

  • 包壓縮包：如下載 vue@2.6.14 後，會生成 vue-2.6.14.tgz 文件；
  • 解壓緩存文件：_cacache 文件夾中存儲解壓後的包源碼（如 vue 的核心文件），下次安裝相同版本時，NPM 直接複用緩存，無需重新下載；
  • 緩存日誌：logs 文件夾中的日誌文件，記錄每次下載的時間、包版本、下載狀態（成功/失敗）。

（3）緩存相關操作

查看當前緩存目錄：

npm config get cache

清理緩存（解決緩存損壞導致的安裝失敗）：

npm cache clean --force

實操案例：執行 npm install vue 時提示“cache corrupted”，執行 npm cache clean --force 清理緩存後，重新安裝即可成功。

npm install（本地安裝）與 npm install -g（全局安裝）的關係（Windows 案例）

三、NPM 的本地安裝（不加 -g）與全局安裝（加 -g）

  • 本地安裝（不加 -g）：每個項目單獨裝，只在當前項目裏能用，存在項目的 node_modules 中。換項目就得重新裝。
  • 全局安裝（加 -g）：裝一次，所有項目 / 目錄都能用，存在當前 Node 版本的全局目錄中。換 Node 版本才需要重新裝。

一句話總結：本地是 “項目專屬，重複裝”；全局是 “一次安裝，全局用（當前 Node 版本下）”。