Windows 中使用 fnm 管理 node (bash配置)

第一步:下载安装fnm

首先我们找到fnm github地址:github.com/Schniz/fnm

我这里选择手动下载 Windows 二进制文件,其它系统可参考其官方文档自行下载安装使用。

第二步:配置PATH环境变量

  1. 下载完成得到一个压缩包,解压得到fnm.exe文件 (此时并非双击执行 哈哈)
  2. 我这里选择在非启动盘D盘新建一个文件夹fnm-windows,其路径为D:\Program Files\fnm-windows,并将fnm.exe文件移入到fnm-windows文件夹内。
  3. 现在需要将fnm配置进PATH环境变量(配置进用户变量还是系统变量可自行选择,我这里都选择用户变量),使得能够在任意目录打开命令行时都能访问到fnm。在任务栏搜索中输入高级系统设置进入环境变量配置页面,也可以在桌面鼠标右键此电脑-->点击属性-->滚动到最下方点击高级系统设置进入。

1.点击环境变量-->2.双击Path编辑用户变量-->3.点击新建并将fnm.exe文件所在的路径位置D:\Program Files\fnm-windows输入其中-->4.点击确定即可新建完成,此时可关掉刚才打开的两个弹窗。

第三步:配置shell

  1. 此时打开命令行工具执行fnm --version可看到fnm版本号
  1. 此时需要配置shell,我这里只配置Git Bash,其它诸如Windows PowerShell命令提示符(CMD)等可参考官网进行配置:Set up your shell for fnm。进入官网shell配置部分复制指令eval "$(fnm env --use-on-cd --shell bash)"。在Git Bash中执行 nano ~/.bashrcnano将在用户目录新建或打开.bashrc文件,此时会进入nano的文本编辑界面,右键Paste粘贴,ctrl+x退出-->Y确认保存修改-->enter确认保存位置并退出nano界面。关掉Git Bash再次进入以使bash配置生效。

--use-on-cd 会在每次切换目录时基于.node-version or .nvmrc切换node版本。

可在当前目录执行node --version > .node-version用以在当前目录生成.node-version文件并将当前node版本写入文件。

第四步:配置环境变量

现在已经可以正常使用fnm了,不过我希望自定义安装目录(默认在C盘),将fnm下载的node不同版本都放在D盘和fnm.exe一起管理。我这里在上述的D:\Program Files\fnm-windows文件夹下新建一个与fnm.exe文件同级的node文件夹来作为安装目录。执行fnm env可看到FNM_DIR环境变量------指向安装目录(FNM_NODE_DIST_MIRROR------指向node下载源,若觉得下载速度慢也可换国内镜像,同FNM_DIR环境变量配置,也可在fnm install [OPTIONS] [VERSION]时通过--node-dist-mirror指定下载镜像)。

本次设置 Node.js 版本下载的国内镜像 (默认为:nodejs.org/dist)

fnm install [VERSION] --node-dist-mirror https://npmmirror.com/mirrors/node/

本次设置 Node.js 版本下载的自定义安装目录 fnm install [VERSION] --fnm-dir "D:\Program Files\fnm-windows\node"

重复之前操作打开高级系统设置进行环境变量配置。

1.点击环境变量-->2.点击新建用户变量-->3.输入变量名:FNM_DIR,变量值:D:\Program Files\fnm-windows\node-->4.点击确定即可新建完成,此时可关掉刚才打开的两个弹窗。

第五步:使用fnm

此时可使用fnm安装node,查看fnm相关命令使用

bash 复制代码
# 查看 fnm 版本
fnm --version

# fnm 帮助
fnm help

# 查看fnm环境变量(FNM_DIR、FNM_NODE_DIST_MIRROR是否已替换)
fnm env

# 查看所有远程可安装的 Node.js 版本
fnm list-remote

# 安装指定版本的 Node.js
fnm install <version>

# 安装最新的 LTS(长期支持)版本
fnm install --lts

# 切换到指定版本的 Node.js
fnm use <version>

# 查看当前正在使用的 Node.js 版本
fnm current

# 查看本地已安装的所有 Node.js 版本
fnm list

# 删除指定版本的 Node.js
fnm uninstall <version>

# 设置默认的 Node.js 版本
fnm default <version>

# 为指定版本设置别名
fnm alias <version> <alias>

# 移除指定的版本别名
fnm unalias <alias>

# 使用指定版本运行命令
fnm exec --using=<version> <command>

此时观察D:\Program Files\fnm-windows\node目录,有以下两个文件夹aliasesnode-versions,其中你的node不同版本就存放在node-versions中。

第六步:配置npm cache路径

此时我们来考虑npm的全局下载路径和缓存路径是否需要修改

bash 复制代码
# 查看 npm 配置信息
npm config list 或 npm config get

# 查看当前 npm cache 和 prefix 路径
npm config get cache
npm config get prefix

# 修改 cache 和 prefix 路径
npm config set cache "D:\nodejs\node_cache"
npm config set prefix "D:\nodejs\node_global"

# 查看 npm 已配置的镜像源
npm config get registry
# 官方
npm config set registry https://registry.npmjs.org
# 淘宝
npm config set registry https://registry.npm.taobao.org

# 查看全局安装的包 -g 表示全局安装的包,--depth=0 只显示顶层依赖,不显示子依赖。
npm list -g --depth=0

# 查看当前项目的本地安装包 在项目根目录下运行以下命令
npm list --depth=0

当你直接安装Node.js时,整个生态系统(Node.js运行时、全局安装的包node_global、缓存node_cache)默认都在C盘。

fnm核心功能是为你管理的每一个Node.js版本都创建独立的安装目录,可以通过在不同node版本下执行npm config get prefix验证。即使使用fnm,所有版本的npm共享同一个全局缓存目录,可以通过在不同node版本下执行npm config get cache验证(两次执行中间需要重启Git Bash或者每次执行后进入目标目录作比较)。

所以这里我推荐只修改npm的全局缓存路径(cache),而不修改全局安装路径(prefix)

bash 复制代码
# 设置新的缓存目录
npm config set cache "D:\Program Files\fnm-windows\npm-cache"

# 通常情况下,不建议再修改全局安装路径,这会带来很多问题

我这里在上述的D:\Program Files\fnm-windows文件夹下新建一个与fnm.exe文件同级的npm-cache文件夹来作为缓存目录。

设置新的缓存目录后你会发现在你的用户目录生成了一个.npmrc文件,打开看就是刚才写入的cache内容:cache=D:\Program Files\fnm-windows\npm-cache

第七步:配置VS Code

打开VS Codectrl+` 打开终端,若Git Bash已为默认打开终端,则无需修改。

Git Bash非默认则点击选择默认配置文件,选择Git Bash即可;也可ctrl+,打开设置,搜索Terminal › Integrated › Default Profile: Windows,选择Git Bash

VS Code中打开集成终端,输入fnm current,回车,如果没有报错,那就说明配置成功了。

相关推荐
用户2519162427112 小时前
Node之net模块
前端·javascript·node.js
李逍2 小时前
pragmatic-drag-and-drop 拖拽神器上手
前端·javascript
阿笑带你学前端2 小时前
当手机遇上电视:Flutter实现局域网遥控输入的奇妙之旅
前端·flutter
张可2 小时前
Kotlin 函数式编程思想
android·前端·kotlin
A了LONE2 小时前
uniapp的上拉加载H5和小程序
前端·javascript·vue.js
早起的年轻人3 小时前
Flutter 3.35.2 以上版本中 数字转字符串的方法指南
前端·flutter
前端小巷子3 小时前
Vue 路由传参的四种方式
前端·vue.js·面试
CodeSheep3 小时前
宇树科技 IPO 时间,定了!
前端·后端·程序员
Mo_jon3 小时前
CSS 瀑布流图片简易实现
前端·css·css3