最近给家里电脑重装系统,都重新安装了 nvm,就记录了一下,也方便大家避坑
简介
nvm 是什么?和 npm 是什么关系?
-
npm
:是 nodejs 包的管理工具,在安装 node 的时候,npm 也会自动一起安装,因为每个 node 版本都有对应的 npm 版本 -
nvm
:是 node 版本管理工具,可以同时在电脑上安装多个不同版本 node,可以非常方便的操作 node 不同版本的切换、安装、查看等等
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
安装命令
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
安装过程中一路点下一步的话就到 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
如图:
在该文件里添加下面两行代码,然后保存。表示使用淘宝境像安装 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
文件:点击前往
下载好之后:
- 把解压出来的文件夹(
cli-xxxx
)重命名为npm
- 放入对应 node 版本下的
node_modules
文件夹里面 - 然后打开该 npm 文件夹里的
bin
文件夹,把里面的npm 文件
和npm.cmd 文件
复制,放到对应 node 版本下,和node_modules
文件夹同级即可
上面操作完成之后,执行 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。
原因是没有权限
解决方案:
- 先打开
powershell
,找不到的话可以通过vscode
打开powershell
- 然后执行
get-ExecutionPolicy
命令,是查看权限的 - 输出结果为
Restricted
,说明权限是禁用的 - 接着执行
set-ExecutionPolicy -Scope CurrentUser
命令 - 会提示输入,然后输入
remotesigned
回车,设置成可用的意思 - 再执行
get-ExecutionPolicy
命令,结果为RemoteSigned
表示更改成功,然后就可以正常加载了
到这,nvm
、node
、npm
安装到正常使用应该都没啥问题了,如有遗漏,欢迎评论区留言指出
结语
如果本文对你有一点点帮助,点个赞支持一下吧,你的每一个【赞】都是我创作的最大动力 _
更多前端文章,或者加入前端交流群,欢迎关注公众号【前端快乐多】,大家一起共同交流和进步呀