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

最近给家里电脑重装系统,都重新安装了 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

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 命令,看下当前的 shellbash 还是 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/

如果不想用淘宝镜像,也可以放心。这里的淘宝镜像只是针对 nodenpm 这两个东西的安装,不是项目中的 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 -vnpm -v 就都有了

接着需要执行 nvm on 命令来开启使用 nvm 来管理 node,如果这个命令报错,请打开管理员模式的 cmdpowershell,再执行 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_PATHD:/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 表示更改成功,然后就可以正常加载了

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

结语

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

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

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,126评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,254评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,445评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,185评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,178评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,970评论 1 284
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,276评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,927评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,400评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,883评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,997评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,646评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,213评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,204评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,423评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,423评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,722评论 2 345

推荐阅读更多精彩内容