NVM學習筆記

文章目錄

• NVM學習筆記
• • 一、環境搭建（使用綠色免安裝版本）
  • • （一）正常情況（安裝Node.js版本是v10.6.0）
    • • 1、下載下傳nvm包，并解壓
      • 2、配置setting.txt，如果沒有則建立，添加如下内容：
      • 3、配置nvm的環境變量
      • 4、下載下傳nodejs
      • 5、配置node環境變量
      • 6、設定npm的源
      • 7、下載下傳vue的工具
      • 8、測試項目
    • （二）搭建過程遇到的特殊情況說明
    • • 1、在”4、下載下傳nodejs“中
      • 2、還是在”4、下載下傳nodejs“中
    • （三）參考

本部落格背景：突然有一天，遇到一個需求，需要将前端頁面的兩個英文逗号改成中文逗号。問題來了，項目是前後端分離開發的，前端使用Vue，前端大佬開發完部署上線後已經離開，而自己本身主要研究後端開發，不怎麼熟悉前端。沒辦法，隻能硬着頭皮上。還好前端大佬代碼風格很好，很快就能大概讀懂源碼，很快找到需要修改的地方改好。但更大的問題來了，Vue源碼修改後需要使用npm進行編譯打包。

隻能繼續往下走，搭建Node環境。

接着查閱了資料，在中文官網（http://nodejs.cn/）看到有免安裝綠色版，即Windows 二進制檔案 (.zip)，個人比較喜歡這類軟體，于是選擇了這種方式（也正是因為這種方式，遇到重重問題）。但是，在公司電腦安裝時，即使是配置好了path、淘寶源和全局變量等，但是仍沒能搭建起來。執行npm時總是輸出下面幾行，而且npm install指令經常失敗。

npm -v
openssl config failed: error:02001003:system library:fopen:No such process
openssl config failed: error:02001003:system library:fopen:No such process
           

于是向朋友了解到了NVM這種方式安裝，也意識到用NVM對Node多版本進行管理是非常明智的，于是打算安裝NVM來安裝和管理Node，使用這種方式來搭建環境。

搭建的過程并非一帆風順，首先在虛拟機上先試一下搭建（個人習慣，安裝軟體會先在虛拟機上試一下），比較順利，很快成功了；第二次在家裡實體機上搭建，遇到一些小困難，不過還是成功了；最後一次在公司電腦上搭建，遇到很多困難，幸運最後也成功了。

于是該文章也應運而生了。

一、環境搭建（使用綠色免安裝版本）

（一）正常情況（安裝Node.js版本是v10.6.0）

1、下載下傳nvm包，并解壓

（1）從Github上下載下傳，但會很慢。網址為：https://github.com/coreybutler/nvm-windows/releases

（2）從百度網盤上找資源下載下傳，稍微快點。

（3）版本說明

nvm-noinstall.zip： 綠色免安裝版本，但需要配置才能使用
nvm-setup.zip：安裝版本，下載下傳之後點選安裝，無需配置就可以使用。
Source code(zip)：zip壓縮的源碼。
Sourc code(tar.gz)：tar.gz的源碼，一般用于Linux系統。
           

2、配置setting.txt，如果沒有則建立，添加如下内容：

将nvm-noinstall.zip解壓縮到指定檔案夾，改名為nvm。如本人解壓到：D:\davesoftware\nvm

接着進入該安裝目錄，建立和配置setting.txt檔案，如下所示：

root: D:\davesoftware\nvm
path: D:\davesoftware\nodejs
arch: 64
proxy: none
node_mirror: https://npm.taobao.org/mirrors/node/
npm_mirror: https://npm.taobao.org/mirrors/npm/
           

說明：

root：可以配置nvm安裝路徑。後面安裝的不同版本Node會預設安裝到配置的目錄下。當然，如果不配置，也是會預設安裝到nvm的安裝路徑的。
path：nodejs安裝路徑。這個貌似一個連結，會連結到nvm use指令指定版本的Node根目錄。
arch：設定目前系統的位數和目前nodejs的位數
proxy：設定代理
node_mirror：node鏡像源
npm_mirror：npm鏡像源
           

（1）root圖例說明：如圖是在虛拟機上的測試案例：NVM的安裝目錄為C:\Program Files\nvm，settings.txt檔案中卻配置了：C:\User\Dave\Desktop\nvm，則後面安裝的不同版本的Node都安裝到了後者，即settings.txt中配置的root路徑。

（2）path圖例說明：如下圖，path配置的nodejs成了一個快捷方式。

如果nvm use 10.6.0指定了版本後，nodejs就指向了版本10.6.0

如果nvm use 9.0.0指定了版本後，nodejs就指向了版本9.0.0

3、配置nvm的環境變量

為了能夠在任何檔案夾路徑下使用nvm指令，接下來需要到系統的環境變量中，配置兩個變量，如下所示：

NVM_HOME = D:\davesoftware\nvm
NVM_SYMLINK = D:\davesoftware\nodejs

在電腦的環境變量中，path屬性加入以上兩個屬性：%NVM_HOME%;%NVM_SYMLINK%
           

驗證：啟動cmd，輸入

nvm -v
           

4、下載下傳nodejs

在電腦的環境變量中，配置好path後，然後打開cmd，執行以下指令：

# v10.6.0指版本号
nvm install v10.6.0

# 指定使用該版本的Nodejs
nvm use v10.6.0

# 檢視指定使用該版本的Nodejs
nvm on v10.6.0
           

5、配置node環境變量

安裝完nodejs後，也是需要配置環境變量的。步驟如下：

（1）把node的路徑加入到系統環境變量中，例如

NODEJS_HOME=D:\davesoftware\nvm\v10.6.0
           

（2）并在path最前面加入 %NODEJS_HOME%;

（3）驗證：重新打開cmd 輸入

node -v
npm -v
           

如果出現版本号則是配置全局npm成功

6、設定npm的源

然後進入Nodejs的安裝目錄，設定npm的源為淘寶源

# 配置npm的源
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
# 配置全局目錄，npm下載下傳的所有插件都會安裝到這裡。
npm config set prefix "D:\davesoftware\nvm\v10.6.0\node_modules\node_global"
npm config set cache "D:\davesoftware\nvm\v10.6.0\node_modules\node_cache"

# 檢視配置清單
npm config list
           

（1）配置npm的源，圖例說明：執行指令後，會在node根目錄下建立子目錄etc，并在etc目錄下建立檔案npmrc，配置這兩個參數。

（2）配置prefix，圖例說明：

如果不設定，則

npm install

下載下傳的子產品會安裝到根目錄下的node_modules中

如果設定了，則會在{prefix}\node_modules下安裝，如圖1所示，并在{prefix}下安裝vue的指令工具，如圖2所示。

圖1：

圖2：

（3）

npm config list

圖例說明：

7、下載下傳vue的工具

npm install -g vue
npm install -g vue-cli
npm install -g webpack
           

-g參數，則會将vue、vue-cli和webpack這些子產品下載下傳安裝到

npm config set prefix "D:\davesoftware\nvm\v10.6.0\node_modules\node_global"

設定的{prefix}\node_modules下，否則會安裝到cmd視窗的目前目錄下。

8、測試項目

首先，進入任何一個檔案夾，打開cmd，運作以下指令：

vue init webpack my-project
           

接着，根據提示填寫資訊，或者回車預設

然後，進入建構好的項目my-project，運作以下指令：

# 啟動項目，端口為8080
npm run dev

# 打包
npm install
# 
npm run build

# 運作”npm run dev”的時候執行的是build/dev-server.js檔案，
# 運作”npm run build”的時候執行的是build/build.js檔案。
           

在浏覽器輸入http://127.0.0.1:8080，或者，http://localhost:8080

最後，如果看到浏覽器出現以下頁面，則說明成功

（二）搭建過程遇到的特殊情況說明

1、在”4、下載下傳nodejs“中

如果發現下載下傳的nodejs目錄下的指令為node64.exe，則需要将node64.exe修改為node.exe；否則需要修改

npm.cmd指令中的

SET "NODE_EXE=%~dp0\node.exe"

。這個在安裝v9.0.0的時候就發現，安裝的node根目錄中，竟然是node64.exe，這樣就導緻npm指令執行不了，因為npm.cmd代碼中的是node.exe。

不過第二次安裝時，執行了指令

nvm on v10.6.0

後，就自動改為了node.exe，不明覺厲。

如下圖所示：

npm.cmd檔案内容如下：

:: Created by npm, please don't edit manually.
@ECHO OFF

SETLOCAL

SET "NODE_EXE=%~dp0\node.exe"
IF NOT EXIST "%NODE_EXE%" (
  SET "NODE_EXE=node"
)

SET "NPM_CLI_JS=%~dp0\node_modules\npm\bin\npm-cli.js"
FOR /F "delims=" %%F IN ('CALL "%NODE_EXE%" "%NPM_CLI_JS%" prefix -g') DO (
  SET "NPM_PREFIX_NPM_CLI_JS=%%F\node_modules\npm\bin\npm-cli.js"
)
IF EXIST "%NPM_PREFIX_NPM_CLI_JS%" (
  SET "NPM_CLI_JS=%NPM_PREFIX_NPM_CLI_JS%"
)

"%NODE_EXE%" "%NPM_CLI_JS%" %*
           

2、還是在”4、下載下傳nodejs“中

如果執行

nvm install -v10.15.3

，即下載下傳的node版本為10.15.3，則會發現，沒有npm工具包。

在這個時候，用了三種方法來解決，第一種是更換版本，如改為v10.6.0。但項目必須用v10.15.3，是以這種PASS了。第二種方法是先将v10.6.0中的npm複制過來，然後執行指令

npm install -g [email protected]

更新npm，但是會報錯，是以也PASS了。

最後解決的辦法是，在Node官網上跳轉到阿裡雲鏡像庫（https://npm.taobao.org/mirrors/node/v0.10.15/）下載下傳10.15.3的綠色免安裝版本壓縮包，解壓到nvm中settings.txt指定的root檔案夾下，改一下檔案名，改為v10.15.3，然後打開cmd，執行

nvm use 10.15.3

。

問題解決。

（三）參考

nvm的正确打開姿勢

nvm安裝踩坑過程

nvm的下載下傳，安裝與使用

node管理工具 nvm 下載下傳安裝和使用

nvm報錯 ERROR open \settings.txt: The system cannot find the file specified

nvm報錯 ERROR open \settings.txt: The system cannot find the file specified