在 angular 項目上運行 npm install 時出錯

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 install 時出現以下錯誤：

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

你有"@angular/cdk": "^11.1.1"尋找@angular/common@"^11.0.0 || ^12.0.0-0"但你的 package.json 有"@angular/common": " ^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

我建議同步您的 angular 包，以便它們在同一版本上。 這可能意味着將所有 @angular 包升級到 v11 或將 cdk 降級到 v9。

在某些情況下，您可以使用--force或--legacy-peer-deps來告訴安裝忽略某些對等依賴項或使用舊依賴項，但由於您的不匹配發生在核心 angular 包之間，因此我不建議在此處使用這種方法。

Answer 2

嘗試yarn install而不是npm install

要安裝紗線使用下面的代碼

npm install --global yarn

Answer 3

我通過直接從項目目錄中刪除node_modules 、 package-lock.json修復它。 通過運行命令npm cache clean --force清理緩存。 現在試試npm i 。