在角项目上运行npm安装时出错

Question

下面是package.json文件：

{
  "dependencies": {
    "@angular/animations": "^9.1.3",
    "@angular/cdk": "^11.1.1",
    "@angular/common": "^9.1.3",
    "@angular/compiler": "^9.1.3",
    "@angular/core": "^9.1.3",
    "@angular/forms": "^9.1.3",
    "@angular/http": "^7.2.15",
    "@angular/localize": "^9.1.3",
    "@angular/platform-browser": "^9.1.3",
    "@angular/platform-browser-dynamic": "^9.1.3",
    "@angular/platform-server": "^9.1.3",
    "@angular/router": "^9.1.3",
    "@angular/service-worker": "^9.1.3",
    "@fortawesome/fontawesome-free-webfonts": "^1.0.9",
    "@kolkov/angular-editor": "^1.1.5",
    "@ng-bootstrap/ng-bootstrap": "^6.1.0",
    "@ng-select/ng-select": "^4.0.0",
    "@ngrx/store": "^9.1.0",
    "@ngx-rocket/scripts": "4.0.0",
    "@ngx-translate/core": "^12.1.2",
    "@pioneer-code/pioneer-tree": "^2.1.0",
    "@types/async": "^3.0.3",
    "@types/d3": "^5.7.2",
    "angular-fusioncharts": "3.0.4",
    "angular-tree-component": "8.5.6",
    "async": "^3.1.0",
    "bootstrap": "^4.4.1",
    "core-js": "^3.5.0",
    "d3": "^5.16.0",
    "david": "^12.0.0",
    "deep-object-diff": "^1.1.0",
    "fusioncharts": "3.15.3",
    "fusionmaps": "^3.15.3",
    "html2canvas": "^1.0.0-rc.5",
    "lodash": "^4.17.15",
    "ng-drag-drop": "^5.0.0",
    "ng2-dragula": "^2.1.1",
    "ngx-bar-rating": "^1.1.0",
    "ngx-bootstrap": "^5.2.0",
    "ngx-chips": "^2.1.0",
    "ngx-color-picker": "^9.1.0",
    "ngx-doc-viewer": "^1.1.0",
    "ngx-drag-drop": "^2.0.0",
    "ngx-export-as": "^1.4.2",
    "ngx-freshchat": "^0.2.0",
    "ngx-infinite-scroll": "^8.0.1",
    "ngx-joyride": "^2.2.11",
    "ngx-quill": "^12.0.1",
    "ngx-take-until-destroy": "^5.4.0",
    "ngx-toastr": "^12.0.1",
    "ngx-toggle-switch": "^2.0.5",
    "ngx-zone-scheduler": "^2.2.1",
    "node-sass": "^4.14.0",
    "quill": "^1.3.7",
    "rxjs": "^6.5.5",
    "socket.io-client": "^3.0.4",
    "tslib": "^1.10.0",
    "underscore": "^1.10.2",
    "uuid": "^7.0.3",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.901.3",
    "@angular/cli": "^9.1.6",
    "@angular/compiler-cli": "^9.1.7",
    "@angular/language-service": "^9.1.3",
    "@biesbjerg/ngx-translate-extract": "^6.0.4",
    "@ngrx/store-devtools": "^9.1.0",
    "@ngx-rocket/scripts": "^4.0.0",
    "@types/file-saver": "^2.0.1",
    "@types/jasmine": "^3.5.10",
    "@types/jasminewd2": "^2.0.8",
    "@types/lodash": "4.14.157",
    "@types/node": "^13.13.4",
    "@types/underscore": "^1.9.4",
    "@types/uuid": "^7.0.3",
    "chalk": "^4.0.0",
    "codelyzer": "^5.1.2",
    "copyfiles": "^2.1.1",
    "cpy": "^8.0.0",
    "file-saver": "^2.0.2",
    "hads": "^2.0.1",
    "htmlhint": "^0.11.0",
    "https-proxy-agent": "^5.0.0",
    "jasmine-core": "^3.5.0",
    "jasmine-spec-reporter": "^5.0.2",
    "karma": "^5.0.1",
    "karma-chrome-launcher": "^3.1.0",
    "karma-cli": "^2.0.0",
    "karma-coverage-istanbul-reporter": "^2.1.1",
    "karma-jasmine": "^3.1.1",
    "karma-jasmine-html-reporter": "^1.5.3",
    "karma-junit-reporter": "^2.0.1",
    "ng-packagr": "^9.0.0",
    "protractor": "^5.4.3",
    "puppeteer": "^3.0.1",
    "rxjs-tslint": "^0.1.7",
    "stylelint": "^13.3.3",
    "stylelint-config-recommended-scss": "^4.2.0",
    "stylelint-config-standard": "^20.0.0",
    "stylelint-scss": "^3.17.1",
    "ts-node": "^8.9.1",
    "tslint": "^6.1.1",
    "typescript": "~3.8.3",
    "webpack": "^4.43.0"
  },
  "peerDependencies": {
    "mobx": "5.15.1",
    "mobx-angular": "3.0.3"
  }
}

在运行npm安装时，我得到了以下错误：

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: bloom@1.0.0
npm ERR! Found: @angular/common@9.1.13
npm ERR! node_modules/@angular/common
npm ERR!   @angular/common@"^9.1.3" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/common@"^11.0.0 || ^12.0.0-0" from @angular/cdk@11.2.13
npm ERR! node_modules/@angular/cdk
npm ERR!   @angular/cdk@"^11.1.1" 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 /Users/ayoubkhial/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/ayoubkhial/.npm/_logs/2021-07-12T23_35_44_624Z-debug.log

在运行以下命令npm install --force时，我得到了以下错误：

​

Answer 1

您有“@转角/cdk”："^11.1.1"查找@角/公共@^11.0.0\x ^12.0.0-0"，但您的package.json有“@package.json/公用”："^9.1.3"。

从这里的错误信息来看，

npm ERR! Could not resolve dependency:
npm ERR! peer @angular/common@"^11.0.0 || ^12.0.0-0" from @angular/cdk@11.2.13
npm ERR! node_modules/@angular/cdk
npm ERR!   @angular/cdk@"^11.1.1" from the root project

我建议同步您的角度包，使他们在相同的版本。这可能意味着要么将所有@角包升级为v11，要么将cdk降级为v9。

在某些情况下，您可以使用--force或--legacy-peer-deps告诉安装要么忽略某些对等依赖关系，要么使用遗留依赖项，但是由于您的不匹配是核心角度包之间的错配，所以这里不建议采用这种方法。

Answer 2

我通过从项目目录中直接删除node_modules，package-lock.json来修正它。通过运行命令npm cache clean --force来清除缓存。现在试试npm i。