Window / Mac 系统 nvm 安装使用指南

2022-11-12  本文已影响0人  IT沐华

最近给家里电脑重装系统，都重新安装了 nvm，就记录了一下，也方便大家避坑

简介

nvm 是什么？和 npm 是什么关系？

nvm 的好处？

比如你电脑上可能跑多个项目的时候，且不同项目所需 node 版本不一致时；

比如升级了项目的 node 版本，结果发现有问题，需要再换回之前的版本时；

如果每次都卸载电脑上的 node 再去下载新的版本，可就太坑了，所以 nvm 来了，直接一条命令让我们切换不同的 node 版本，非常方便

如果你的电脑已经安装了 node，那么在安装 nvm 之前要先卸载掉，避免后面产生不必要的冲突

Window 控制面板程序卸载或者用其他的应用卸载都行

Mac 卸载：

# 删除全局 node_modules 目录
sudo rm -rf /usr/local/lib/node_modules
# 删除 node
sudo rm /usr/local/bin/node 
# 删除全局 node 模块注册的软链
cd /usr/local/bin && ls -l | grep "../lib/node_modules/" | awk '{print $9}'| xargs rm

Mac 安装 nvm

Mac nvm 文档

安装命令

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.2/install.sh | bash

或者

wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.2/install.sh | bash

命令中的 v0.39.2 是版本号，是 Mac 当前最新版，如果需要安装不同版本，修改这里即可

安装完成后，在命令行窗口输入 nvm 回车，安装成功会出现满满一页的各种信息，如果只有 nvm: command not found，就说明没安装成功

没安装成功的话，执行 echo $0 命令，看下当前的 shell 是 bash 还是 zsh

如果是 bash 安装失败基本是没有 .bash_profile 这个文件，可以使用 open .bash_profile 命令打开这个文件试下，打不开就说明没有，那么执行下面命令创建一个，再重新执行上面的安装命令即可

# 创建 .bash_profile 文件
touch ~/.bash_profile

如果是 zsh，那就打开 open .zshrc 文件，在里面添加一行 source ~/.bash_profile，如果打不开这个文件，就先创建一个，再添加，再重新执行上面的安装命令即可

# 创建 .zshrc 文件
touch ~/.zshrc

# 创建完成，再打开，在里面添加这个
source ~/.bash_profile

安装成功后怎么使用，请继续看

Window 安装 nvm

nvm 下载地址

image.png

安装过程中一路点下一步的话就到 C 盘了(也可以自定义目录)，到这里执行 nvm 命令肯定不会失败，接下来就安装 node 就行了，比如安装 16.16.0 这个版本的 node 就执行如下命令，如下版本号前加不加 v 是一模一样的

# nvm install v16.16.0
nvm install 16.16.0

注意这里的 install 不能省略成 i，会报错

安装有可能失败，也有可能成功，也有可能成功一半，成功一半的意思是 node 安装成功，但是 npm 安装失败，终端不会提示这个失败信息，只是在安装完成后输入 node -v 有值，npm -v 就报错

所以建议在使用 nvm install xxxx 之前，先打开 nvm 安装目录下的 settings.text 如图：

image.png

在该文件里添加下面两行代码，然后保存。表示使用淘宝境像安装 node 和 npm，再运行 nvm install xxxx 即可，就不会安装失败了

node_mirror:npm.taobao.org/mirrors/node/
npm_mirror:npm.taobao.org/mirrors/npm/

如果不想用淘宝镜像，也可以放心。这里的淘宝镜像只是针对 node 和 npm 这两个东西的安装，不是项目中的 npm i xxx 也用淘宝镜的意思，项目中的需要另外配置，项目中使用淘宝镜像如下：

# npm 用淘宝镜像
npm config set registry http://registry.npm.taobao.org/
# 或安装 cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm config  set registry https://registry.npm.taobao.org
cnpm config get registry
cnpm -v

如果你不想用淘宝镜像，却出现安装了 node 却没有 npm 的问题，那只能手动安装 npm，如下

先查看 node 不同版本对应 npm 版本号：点击前往

再去下载对应的 npm 版本的 zip 文件：点击前往

下载好之后：

上面操作完成之后，执行 node -v 和 npm -v 就都有了

接着需要执行 nvm on 命令来开启使用 nvm 来管理 node，如果这个命令报错，请打开管理员模式的 cmd 或 powershell，再执行 nvm on 即可

nvm 常用命令

比较常用的几个命令，注意看下注释

nvm install <版本号>   // 安装指定 node 版本，版本号如写 14.5.0 或 v14.5.0 效果一样
nvm uninstall <版本号> // 卸载指定 node 版本
nvm install stable    // 安装最新稳定版 node
nvm ls                // 查看已经安装了的所有 node 版本
nvm on                // 开启使用 nvm 管理 node
nvm use <版本号>      // 切换到指定 node 版本
nvm alias default <版本号> // 如果 nvm use xxx 换不了，就用这个换
nvm off               // 关闭 nvm 管理 node

修改 npm 全局目录及环境变量

Window 下可以使用 npm root -g 命令查看默认全局安装目录，大概是这样的

C:\Users\Administrator\AppData\Roaming\npm\node_modules

如果想把全局目录和缓存文件单独放到其他地方方便区分管理，且不占 C 盘的话，可以自己随意在其他盘新建目录，比如有如下目录结构用来存放

D:
└─node
    ├─node_cache
    └─node_global
        └─node_modules

先执行如下两条命令修改默认 npm 全局安装路径，和安装过程缓存文件存储路径

# 上面的路径，如下，如果设置失败看后面的后续处理第 1 条
npm config set prefix 'D:/node/node_global'
npm config set cache 'D:/node/node_cache'

# 然后输入下面这个命令查看是否修改成功
npm config ls

然后配置环境变量即可

在用户或系统变量 path 里添加：D:/node/node_global

在系统变量添加 NODE_PATH：D:/node/node_global/node_modules

安装后续错误处理

只是 windows 会存在如下问题

用 npm 安装插件报错或设置 npm 全局路径报错

npm ERR! Please try running this command again as root/Administrator

解决方案：

删除 .npmrc 文件，文件位置：C:\Users\{账户}\.npmrc，有些电脑没有 Users 文件夹的，而是中文的【用户】文件夹，是一样的

安装好的东西不能加载

比如 npm i yarn -g 安装成功后，我再执行 yarn -v 报错如下

yarn : 无法加载文件 xxxx\node_global\yarn.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。

原因是没有权限

解决方案：

到这，nvm、node、npm 安装到正常使用应该都没啥问题了，如有遗漏，欢迎评论区留言指出

结语

如果本文对你有一点点帮助，点个赞支持一下吧，你的每一个【赞】都是我创作的最大动力 _

更多前端文章，或者加入前端交流群，欢迎关注公众号【前端快乐多】，大家一起共同交流和进步呀

上一篇下一篇

猜你喜欢

热点阅读