编辑器和环境配置

Node 版本切换工具

推荐使用 fnm 切换 Node 版本，最大的优势是，不同的项目可以同时运行不同的 Node 版本。

fnm 是一个基于 Rust 开发的 Node 版本管理工具，它的目标是提供一个快速、简单且可靠的方式来管理 Node.js 的不同版本。同时，它是跨平台的，支持 macOS、Linux、Windows。

警告

安装 fnm 后，会导致 nvm 失效，如果过度依赖 nvm，不建议安装。

安装

MacOS/Linux

# 安装命令：
curl -fsSL https://fnm.vercel.app/install | bash

# 更新命令
curl -fsSL https://fnm.vercel.app/install | bash -s -- --skip-shell

Windows

安装方式一：

# 安装命令：
# Winget
winget install Schniz.fnm

# Scoop
scoop install fnm

安装方式二：【推荐】

方式一没有用过，不确定是否能灵活配置，建议直接用方式二

下载地址：fnm releases，下载对应系统版本，解压完之后得到一个 fnm.exe 文件，将这个文件拷贝到要安装的目录，比如 D:\fnm，然后分别新建目录 node 和文件fnm_init.cmd，然后在node 目录下新建目录 aliases、node-versions 和文件cd.cmd，如图所示。

fnm_init.cmd 内容如下：

@echo off
:: for /F will launch a new instance of cmd so we create a guard to prevent an infnite loop
if not defined FNM_AUTORUN_GUARD (
    set "FNM_AUTORUN_GUARD=AutorunGuard"
    FOR /f "tokens=*" %%z IN ('fnm env --use-on-cd') DO CALL %%z
)

cd.cmd 内容如下：

@echo off
cd %*
if "%FNM_VERSION_FILE_STRATEGY%" == "recursive" (
  fnm use --silent-if-unchanged
) else (
  if exist .nvmrc (
    fnm use --silent-if-unchanged
  ) else (
    if exist .node-version (
      fnm use --silent-if-unchanged
    )
  )
)
@echo on

这俩文件主要的作用是，通过 cmd 命令切换到项目目录的时候，会自动读取 .nvmrc 或 .node-version 文件中的内容，并切换到对应的版本。

配置环境变量

将 Fnm 的安装路径添加到系统的环境变量中，具体步骤如下：

右键点击“此电脑”或“我的电脑”，选择“属性”；
点击“高级系统设置”；
在“系统属性”窗口中，点击“环境变量”；
在“用户变量”部分，点击“新建”；
分别输入变量名FNM_DIR变量值D:\fnm\node、FNM_NODE_DIST_MIRRORs变量值D:\fnm\node；
双击Path，在弹出的窗口中点击“新建”，输入D:\fnm 和 D:\fnm\node\aliases\default；

Windows powershell 配置

通过管理员权限打开 powershell，执行以下命令：

fnm --version

如果显示 Fnm 的版本号（如下图所示），则表示安装成功。否则请重新尝试以上步骤。

运行（如果不配置这个，每次打卡 shell 运行 fnm 命令，会提示没有 fnm 环境），在 powershell 中执行以下命令：

notepad $profile

如果提示文件不存在需要新增则点击是，然后在打开的文件中输入下列内容并保存。

# 自动切换到 .node-version 中的版本
function cd {
    Set-Location $args[0]
    fnm use --silent
}

fnm env --use-on-cd | Out-String | Invoke-Expression

常用命令

# 命令帮助
fnm --help

# 查看远程可用版本
fnm list-remote

# node 已安装列表
fnm list

# node 安装
fnm install 版本号(支持模糊/lts)

fnm install lts # 安装最新的 lts 版本
fnm install 22 # 安装指定版本 22 最新的子版本号
fnm install 22.0.0 # 安装指定版本 22.0.0

# node 卸载
fnm uninstall 版本号

# node 切换
fnm use 版本号

# node 设置默认
fnm default 版本号

如果通过 fnm 切换 node 版本后，在 cmd 中执行 node -v ，出现找不到，可能就是环境变量 D:\fnm\node\aliases\default 未配置或者配置错误。

开发工具配置

打开项目自动切换node版本

项目的根目录需要包含 .node-version 文件，文件内容为要使用的 Node 版本号，比如 22.0.0 或 22.0 或 22，如果未安装指定版本，会提示是否安装。如果设置的是 22，则会自动选择本机已安装 22 版本的最新子版本号。

设置流程：进入开发工具设置页，也可通过快捷键进入，按 ctrl+p 然后输入设置，选择首选项：打开用户设置(JSON), 然后在打开的文件中添加以下内容：

json

{
  "terminal.integrated.defaultProfile.windows": "Command Prompt",
  "terminal.integrated.profiles.windows": {
    "Command Prompt": {
      "path": ["${env:windir}\\System32\\cmd.exe"],
      "args": [
        "/k",
        "fnm env --use-on-cd >NUL 2>&1 && if exist .node-version (fnm use)"
      ]
    }
  },
}

说明：

terminal.integrated.defaultProfile.windows：设置默认的终端为 Command Prompt，可选值：PowerShell、Git Bash（需要安装git）等。
terminal.integrated.profiles.windows：配置 Command Prompt 终端的参数，包括路径和启动参数。
- path：指定 Command Prompt 的可执行文件路径。
- args：设置启动参数，这里的作用是在启动 Command Prompt 时，自动执行 fnm env --use-on-cd 命令，以启用 Fnm 自动切换 Node 版本的功能。

配置插件

不管是使用 vscode 还是 cursor 还是 Trae，都推荐安装以下插件：

Vue (Official)：Vue官方插件，提供语法高亮、智能提示、代码格式化，Vue3开发首选，Vue2 不推荐使用。
ESLint：提供ESLint规则检查，编码时实时发现并修复问题
Prettier：代码格式化工具，确保项目代码风格统一
UnoCSS：即时原子CSS引擎，实时预览和生成CSS样式
uni-helper：uni-app开发助手，提供代码提示、条件编译语法高亮
any-rule：常用正则表达式库，快速查找和应用正则表达式
TODO Highlight：高亮代码中TODO注释，快速定位待办事项
Error Lens：实时显示代码错误和警告，提升问题定位效率

其他插件在模板项目中.vscode 目录下的 extensions.json 文件中配置，主要是辅助类的插件，当通过开发工具打开项目的时候，有未安装的会提示是否安装插件。

编辑器和环境配置 ​

Node 版本切换工具 ​

安装 ​

MacOS/Linux ​

Windows ​

配置环境变量 ​

开发工具配置 ​

打开项目自动切换node版本 ​

配置插件 ​