开发避坑短篇（3）：解决@vitejs plugin-vue@5.0.5对Vite^5.0.0的依赖冲突

异常信息

# npm resolution error report


While resolving:system@3.8.8
Found: vite@6.2.3
node_modules/vite
  dev vite@"6.2.3" from the root project


Could not resolve dependency:
peer vite@"^5.0.0" from @vitejs/plugin-vue@5.0.5
node_modules/@vitejs/plugin-vue
  dev @vitejs/plugin-vue@"5.0.5" from the root project


Fix the upstream dependency conflict, or retry
this command with --force or --legacy-peer-deps
to accept an incorrect (and potentially broken) dependency resolution.

异常背景

刚从gitlab克隆下来的源码，首次执行npm install安装依赖时报错，当前node.js的版本为20.18.0

* 20.18.0 (Currently using 64-bit executable)
  16.15.1
  10.14.1

异常分析

翻译错误信息：

在解析system@3.8.8 时发现：
当前安装的 vite 版本为 6.2.3
位于 node_modules/vite 目录
项目根目录中指定开发依赖 vite@“6.2.3”

无法解析的依赖项：
@vitejs/plugin-vue@5.0.5 要求 peer 依赖 vite@“^5.0.0”
位于 node_modules/@vitejs/plugin-vue 目录
项目根目录中指定开发依赖 @vitejs/plugin-vue@“5.0.5”

解决方法：
修复上游依赖冲突，或使用 --force 或 --legacy-peer-deps 参数重试命令
这将接受一个不正确(且可能损坏)的依赖解析方案

查看package.json文件中指定的@vitejs/plugin-vue的版本

{
  "name": "system",
  "version": "3.8.8",
  "description": "xxx系统",
  ...
  "scripts": {
    "dev": "vite",
    "build:prod": "vite build",
    "build:stage": "vite build --mode staging",
    "preview": "vite preview"
  },
  ...
  "dependencies": {
    "@element-plus/icons-vue": "2.3.1",
    ...
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "5.0.5",
	...
  }
}

解决方法

实际上刚克隆下来的源码还没有任何依赖，也就是 /node_modules目录都还没有，所以根据提示，强制下载依赖包，执行以下命令：

npm install --force or --legacy-peer-deps

–force 参数：强制覆盖本地缓存和版本限制，重新下载远程资源‌。

–legacy-peer-deps 参数：忽略对等依赖（如 Vue 插件与 Vite 版本不匹配）‌）的版本检查，采用 npm v4-v6 的宽松解析逻辑‌。