都2024年了,你还不会使用nvm管理node版本吗(卸载原有node,安装nvm,配置环境变量)

447 阅读3分钟

一、卸载已安装的node

如果你已经安装了node.js,请先卸载node,然后再安装nvm。如果没有安装过node,就请直接安装nvm。 控制面板-程序-选中node,右键卸载或者使用电脑管家等软件卸载node。 为了确保node彻底删除干净,node的安装目录也请一起删掉

  • C:\Program Files (x86)\Nodejs

  • C:\Program Files\Nodejs

  • C:\Users{User}\AppData\Roaming\npm

  • C:\Users{User}\AppData\Roaming\npm-cache

  • 删除C:\Users\用户名 下的 .npmrc文件以及 .yarnrc 文件

  • 环境变量中npm、node的所有相关统统删掉

二、nvm是什么?

    nvm(node.js version management)是一个node.js多版本管理工具。有了nvm,我们可以很方便的管理多个node版本,根据项目需要,切换合适的node版本使用。

三、安装nvm

1.下载nvm

nvm下载路径:https://github.com/coreybutler/nvm-windows/releases

Snipaste_2024-08-06_14-33-04.png

2.安装nvm

Snipaste_2024-08-06_14-36-04.png

Snipaste_2024-08-06_14-36-37.png

Snipaste_2024-08-06_14-40-51.png 上面我们可以看到nvm和node的默认安装路径都是C盘,最好不要放在C盘,我是放到D盘了。 注意:安装路径不要出现中文、空格等,否则后期出现一些符号格式不正确之类的问题。

3.配置路径和下载镜像

安装完成后,找到nvm下的settings文件,将下面的内容复制覆盖。
root: D:\nvm
path: D:\node
node_mirror: https://npmmirror.com/mirrors/node/
npm_mirror: https://npmmirror.com/mirrors/npm/

Snipaste_2024-08-06_14-52-04.png 第一行是nvm安装路径,第二行是node安装路径。第三行是node下载镜像源,第四行是npm下载镜像源。

4.检查是否安装成功

win+R打开命令窗口,输入nvm,如下图所示安装成功

Snipaste_2024-08-06_14-56-32.png

四、使用nvm安装node

以管理员身份运行命令窗口,输入 nvm list available 查看可安装版本

Snipaste_2024-08-06_15-02-14.png

1.安装制定node版本

nvm install v12.22.12

Snipaste_2024-08-06_15-16-22.png

2.安装完成后使用nvm use 使用指定版本

nvm use v12.22.12

Snipaste_2024-08-06_15-19-26.png 3.使用指定版本后 node -v 查看node安装是否成功 npm -v查看npm 安装是否成功

Snipaste_2024-08-06_15-20-16.png 4.nvm list 查看已安装的node版本号

Snipaste_2024-08-06_15-32-42.png 5.删除已安装的node

nvm uninstall node版本号//nvm uninstall v12.22.12

Snipaste_2024-08-06_15-34-45.png

五、修改镜像源为淘宝镜像源

npm config set registry https://registry.npmmirror.com/

检查是否设置成功 ,成功返回:registry.npmmirror.com/

npm config get registry

Snipaste_2024-08-06_15-41-15.png

六 环境变量配置

为了防止nvm切换node版本,造成全局安装的npm包无法使用,我们直接在nvm目录下创建node_cache和node_global两个文件夹

Snipaste_2024-08-06_16-34-09.png 打开命令窗口,执行下面两个命令:

npm config set prefix "D:\nvm\node_global"
npm config set cache "D:\nvm\node_cache"

检查是否安装成功:

npm config get prefix
npm config get cache

Snipaste_2024-08-06_16-37-51.png

2.设置环境变量

我的电脑->属性->高级系统设置->系统属性->环境变量
如果环境变量没有正确配置,输入 node -v 系统不会识别node命令,我们需要配置系统环境变量和用户变量。系统环境变量:NODE_PATH;用户环境变量:path

Snipaste_2024-08-06_22-28-07.png

Snipaste_2024-08-06_22-28-24.png nvm的环境变量在安装nvm时,已经自动生成

七、测试安装全局模块

npm install -g @vue/cli

如下图所示,说明安装成功

Snipaste_2024-08-06_16-55-48.png

八、切换NODE版本,检查全局安装的npm包是否存在

当前版本检查@vue/cli,版本5.0.8,切换node版本,检查@vue/cli,版本是5.0.8,说明切换node版本后全局安装的包还是可以使用的。