Angular15项目npm audit严重漏洞修复：hermes-engine与react-native依赖问题

问题概况 #

我把项目升级到Angular 15后，用npm audit检测出严重漏洞：

hermes-engine <=0.9.0，严重级别，存在资源类型不兼容访问问题；react-native <=0.0.0-ffdfbbec0 || 0.61.0-rc.0 - 0.67.5依赖了有漏洞的hermes-engine版本。

按提示执行npm audit fix后问题没解决，而且我的package.json里根本没直接依赖react-native或hermes-engine，但package-lock.json里却有这两个包，想知道它们怎么来的，能不能安全移除，以及具体修复方法。

我的package.json内容如下：

{
  "name": "my-app",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^15.2.4",
    "@angular/cdk": "^13.2.0",
    "@angular/common": "^15.2.4",
    "@angular/compiler": "^15.2.4",
    "@angular/core": "^15.2.4",
    "@angular/forms": "^15.2.4",
    "@angular/localize": "^15.2.4",
    "@angular/material": "^13.2.0",
    "@angular/platform-browser": "^15.2.4",
    "@angular/platform-browser-dynamic": "^15.2.4",
    "@angular/router": "^15.2.4",
    "@ng-bootstrap/ng-bootstrap": "^14.0.1",
    "aws-amplify": "^4.3.13",
    "bootstrap": "^4.6.2",
    "chart.js": "^2.9.4",
    "luxon": "^1.25.0",
    "ng2-charts": "^2.4.2",
    "ngx-toastr": "^13.2.0",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^15.2.4",
    "@angular/cli": "^15.2.4",
    "@angular/compiler-cli": "^15.2.4",
    "@types/jasmine": "~3.6.0",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "^6.3.13",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "karma-junit-reporter": "^2.0.1",
    "ng2-charts-schematics": "^0.1.7",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.8.4"
  },
  "browser": {
    "crypto": false
  }
}

依赖出现的原因 #

• 这俩是间接依赖：你某个直接依赖的包（比如aws-amplify这种跨端库）内部用到了react-native相关组件，npm安装时会把所有层级的依赖都写入package-lock.json，哪怕你根本用不上react-native的功能。

修复方案 #

方案1：用npm overrides强制升级（最稳妥） #

在package.json里加个overrides字段，强制把react-native和hermes-engine升到安全版本：

{
  // 保留你原有的package.json内容，新增下面这段
  "overrides": {
    "react-native": "0.68.0",
    "hermes-engine": "0.10.0"
  }
}

加完后执行：

npm install

这个操作会让所有间接依赖都用你指定的安全版本，不会影响项目业务代码。

方案2：找到上游依赖并升级 #

先查清楚是哪个直接依赖引入了react-native：

npm ls react-native

输出会显示路径，比如可能是aws-amplify。然后把这个依赖包升级到最新版（一般新版本会修复依赖问题）：

npm update aws-amplify --save

之后再跑npm audit看看漏洞有没有解决。

方案3：清理重装依赖试试 #

如果确定这些依赖完全没用，可以试试清理后重装：

1. 删除node_modules和package-lock.json：

rm -rf node_modules package-lock.json

2. 重新安装：

npm install

3. 再跑npm audit检查，如果漏洞还在，说明确实是上游依赖带进来的，得用方案1或2。

注意事项 #

• 用overrides后一定要测一遍项目功能，确保升级后的依赖没兼容性问题。
• 平时要定期更新直接依赖，减少间接依赖带来的安全风险。

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