typescript - Npm 依赖冲突

Question

我正在使用 Vue 开发一个项目。我运行 Vue Cli 并添加了 Typescript 插件。我有几个弱点。当我运行 npm audit fix 时，它无法解决依赖冲突:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: @typescript-eslint/eslint-plugin@4.33.0
npm ERR! Found: eslint@6.8.0
npm ERR! node_modules/eslint
npm ERR!   dev eslint@"^6.7.2" from the root project
npm ERR!   peer eslint@"^5.0.0 || ^6.0.0 || ^7.0.0" from @typescript-eslint/eslint-plugin@4.33.0
npm ERR!   node_modules/@typescript-eslint/eslint-plugin
npm ERR!     dev @typescript-eslint/eslint-plugin@"^4.33.0" from the root project
npm ERR!     peer @typescript-eslint/eslint-plugin@"^4.4.0" from @vue/eslint-config-typescript@7.0.0
npm ERR!     node_modules/@vue/eslint-config-typescript
npm ERR!       dev @vue/eslint-config-typescript@"^7.0.0" from the root project
npm ERR!   9 more (@typescript-eslint/experimental-utils, eslint-utils, ...)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer eslint@"^5.0.0 || ^6.0.0 || ^7.0.0" from @typescript-eslint/eslint-plugin@4.33.0
npm ERR! node_modules/@typescript-eslint/eslint-plugin
npm ERR!   dev @typescript-eslint/eslint-plugin@"^4.33.0" from the root project
npm ERR!   peer @typescript-eslint/eslint-plugin@"^4.4.0" from @vue/eslint-config-typescript@7.0.0
npm ERR!   node_modules/@vue/eslint-config-typescript
npm ERR!     dev @vue/eslint-config-typescript@"^7.0.0" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: eslint@7.32.0
npm ERR! node_modules/eslint
npm ERR!   peer eslint@"^5.0.0 || ^6.0.0 || ^7.0.0" from @typescript-eslint/eslint-plugin@4.33.0
npm ERR!   node_modules/@typescript-eslint/eslint-plugin
npm ERR!     dev @typescript-eslint/eslint-plugin@"^4.33.0" from the root project
npm ERR!     peer @typescript-eslint/eslint-plugin@"^4.4.0" from @vue/eslint-config-typescript@7.0.0
npm ERR!     node_modules/@vue/eslint-config-typescript
npm ERR!       dev @vue/eslint-config-typescript@"^7.0.0" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! See /home/pau/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/pau/.npm/_logs/2021-10-29T19_09_55_798Z-debug.log

我正在使用 node 版本 v14.17.4，npm 版本 8.0.0。

这是我的package.json。我使用 Vue Cli 配置了大​​部分项目，当前版本为 @vue/cli 4.5.14。

{
  "name": "uama.groundframework.frontend",
  "version": "0.1.0",
  "private": true,
  "description": "## Project setup ``` npm install ```",
  "author": "",
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build && npm run copy_web-inf",
    "lint": "vue-cli-service lint",
    "capacitor:build": "vue-cli-service capacitor:build",
    "capacitor:serve": "vue-cli-service capacitor:serve",
    "copy": "ncp ./node_modules/@arcgis/core/assets ./public/assets",
    "copy_web-inf": "ncp ./../../WEB-INF ./../../Servlets_Sockets/src/main/webapp/WEB-INF",
    "electron:build": "vue-cli-service electron:build",
    "electron:serve": "vue-cli-service electron:serve",
    "postinstall": "electron-builder install-app-deps && npx cap update android",
    "postuninstall": "electron-builder install-app-deps"
  },
  "main": "background.js",
  "dependencies": {
    "@arcgis/core": "^4.20.2",
    "@capacitor/android": "^2.0.0",
    "@capacitor/cli": "^2.0.0",
    "@capacitor/core": "^2.0.0",
    "@capacitor/ios": "^2.0.0",
    "@types/arcgis-js-api": "^4.20.1",
    "axios": "^0.21.1",
    "core-js": "^3.17.0",
    "hammerjs": "^2.0.8",
    "mathjs": "^9.4.4",
    "ncp": "^2.0.0",
    "vue": "^2.6.14",
    "vue-class-component": "^7.2.3",
    "vue-property-decorator": "^9.1.2",
    "vue-router": "^3.5.2",
    "vuetify": "^2.5.8",
    "vuex": "^3.5.1"
  },
  "devDependencies": {
    "@types/electron-devtools-installer": "^2.2.0",
    "@typescript-eslint/eslint-plugin": "^4.33.0",
    "@typescript-eslint/parser": "^4.33.0",
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-router": "^4.5.4",
    "@vue/cli-plugin-typescript": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/eslint-config-typescript": "^7.0.0",
    "babel-eslint": "^10.1.0",
    "dotenv-webpack": "^7.0.3",
    "electron": "^13.0.0",
    "electron-devtools-installer": "^3.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "sass": "^1.38.2",
    "sass-loader": "^8.0.0",
    "typescript": "~4.1.5",
    "vue-cli-plugin-capacitor": "~2.0.1",
    "vue-cli-plugin-electron-builder": "~2.1.1",
    "vue-cli-plugin-vuetify": "~2.0.7",
    "vue-template-compiler": "^2.6.14",
    "vuetify-loader": "^1.7.3"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended",
      "@vue/typescript"
    ],
    "parserOptions": {
      "parser": "@typescript-eslint/parser"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ],
  "keywords": [],
  "license": "ISC"
}

Answer 1

您的 package.json 混合了以 ~ 开头的版本和以 ^ 开头的开发依赖项。这可能是因为一些开发依赖项是使用旧版本的 npm 安装的，默认为 ~，这比 ^ 更保守。 第一步，将 8 个 ~ 版本更改为 ^，删除 node_modules 和(如果存在)package- lock.json 并再次运行 npm install。 我在本地对此进行了测试，它并没有减少 npm audit 报告的漏洞数量，但是它确实减少了过时软件包的数量，这是朝着正确方向迈出的一步。

让我们通过只查看生产依赖项的审计结果并忽略(至少暂时)开发依赖项中的问题来简化事情。 npm audit --only=prod 只报告了 5 个问题，都是中等的。 运行 npm audit --only=prod --force fix 更新 @capacitor/cli 从 2.x 到 3.x。改变，所以你会想要测试它，但如果这对你有用，恭喜你，因为 npm audit --only=prod 报告没有漏洞。

此时，您可以选择不太担心 npm audit 报告的其他问题。但是，如果您想修复它们，这是我推荐的可能乏味/艰巨的路径:

• 对所有开发依赖项进行手动审核，以确保没有包含不需要的内容。也许您安装了一些您没有使用的东西。卸载它们。也许您安装了一些很不错但实际上并不需要的东西。也考虑卸载它们。
• 运行 npm outdated 以查看可以通过重大更改手动更新的内容。尝试进行这些更新。