Angular 13升级后loader-utils存在5个严重漏洞的修复咨询

方案1：使用npm overrides（推荐，npm 8.3+支持） #

• 在项目根目录的package.json中添加overrides字段，强制指定loader-utils的安全版本：

  "overrides": {
    "loader-utils": "^2.0.4"
  }
  

  若npm ls loader-utils显示不同依赖路径下的loader-utils版本不一致，可针对特定依赖路径单独指定：

  "overrides": {
    "some-direct-dependency>loader-utils": "^2.0.4"
  }
  

• 执行npm install，npm会自动重构依赖树，将所有loader-utils实例替换为指定的安全版本，无需手动修改package-lock.json。
• 验证：执行npm ls loader-utils确认所有实例均为2.0.4或兼容的安全版本（优先选2.0.4，Angular 13配套的webpack版本与3.x兼容性更差）。

方案2：使用yarn resolutions（若项目用yarn） #

• 在package.json中添加resolutions字段统一版本：

  "resolutions": {
    "**/loader-utils": "^2.0.4"
  }
  

• 执行yarn install，yarn会强制将所有依赖树中的loader-utils替换为指定版本。

方案3：升级引入旧版的直接依赖 #

• 从npm ls loader-utils的输出中定位直接依赖（比如某webpack loader、Angular插件），这些依赖间接引入了旧版loader-utils。
• 查看这些直接依赖的最新版本，确认其已升级到依赖安全版loader-utils的版本。
• 执行npm update <direct-dependency-name>升级直接依赖，再执行npm install让依赖树自动更新到安全版本。

方案4：临时补丁（兼容优先时用） #

• 使用patch-package工具给loader-utils打补丁：
  1. 安装工具：npm install patch-package --save-dev
  2. 手动修改node_modules/loader-utils中的代码（对应漏洞修复内容）
  3. 生成补丁：npx patch-package loader-utils
  4. 将生成的patches目录提交到版本控制，后续npm install会自动应用补丁。

关键注意事项 #

• 优先选择2.0.4版本，3.x版本与Angular 13配套的webpack版本兼容性风险更高，易引发编译问题。
• 每次调整依赖后，执行ng build或ng serve验证编译是否正常，确保无兼容性报错。

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