Angular 12.1.5项目安装Transloco出现ERESOLVE依赖报错如何修复

问题核心 #

触发ERESOLVE报错和Transloco本身无直接关联，根因是项目内已安装的angular-crumbs@3.0.1已停止维护多年，其声明的peer依赖要求@angular/common版本范围为>=2.0.0 <7.0.0，和当前项目使用的@angular/common@12.1.5版本不兼容。npm 7及以上版本默认开启严格peer依赖校验，因此安装新依赖时直接阻断了流程。

修复方案（按推荐优先级排序） #

• 方案1：替换废弃的angular-crumbs库（长期最优方案）
  angular-crumbs@3.0.1最高仅支持Angular 6版本，本身在Angular 12项目中就存在潜在运行时兼容风险，只是之前未触发peer校验没有暴露问题。
  操作步骤：

  1. 卸载旧依赖：执行npm uninstall angular-crumbs
  2. 选型安装仍在维护、适配Angular 12版本的面包屑导航库（如xng-breadcrumb），替换项目中原有的面包屑功能实现
  3. 重新执行ng add @ngneat/transloco即可正常完成集成

• 方案2：临时跳过peer依赖校验（快速验证方案，存在运行风险）
  如果暂时无法替换angular-crumbs，可在安装命令后追加--legacy-peer-deps参数，让npm沿用v6版本的依赖解析逻辑，跳过严格peer校验：

  ng add @ngneat/transloco -- --legacy-peer-deps
  

  注意：该方案仅绕过安装阶段的校验，由于angular-crumbs和Angular 12版本跨度较大，后续运行过程中可能出现未知异常，仅适合临时调试场景，不建议生产环境使用。
  如果需要长期为当前项目跳过peer校验，可在项目根目录新建或修改.npmrc文件，添加配置legacy-peer-deps=true，后续执行npm命令时无需重复追加参数。

• 方案3：强制覆写依赖版本规则（适合已验证旧库可正常运行的场景）
  如果已经验证angular-crumbs@3.0.1在Angular 12环境下可正常运行，仅为peer依赖声明未及时更新，可通过npm的overrides配置强制对齐依赖版本，无需替换库也无需全局跳过校验：

  1. 打开项目根目录的package.json文件，新增如下配置段：

  "overrides": {
    "angular-crumbs": {
      "@angular/common": "$@angular/common",
      "@angular/core": "$@angular/core"
    }
  }
  

  2. 删除项目下的node_modules文件夹和package-lock.json文件，执行npm install重新安装全量依赖
  3. 依赖重装完成后，再执行Transloco的安装命令即可走正常流程。

内容的提问来源于stack exchange，提问作者Math