Error while running npm install on angular 9 project

Question

Angular cli: 9.1.12
global Angular cli: 14.0.5

When running npm install i got the following error:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR: While resolving. jiffyweb@0.0.0
npm ERR: Found. @angular/common@9.1.13
npm ERR! node_modules/@angular/common
npm ERR. @angular/common@"~9.1.12" from the root project
npm ERR!
npm ERR: Could not resolve dependency:
npm ERR. peer @angular/common@"^6.0.0 || ^7.0.0 || ^8.0.0" from @agm/core@1.1.0
npm ERR! node_modules/@agm/core
npm ERR. @agm/core@"^1.1.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 C.\Users\91886\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR: A complete log of this run can be found in:
npm ERR: C.\Users\91886\AppData\Local\npm-cache_logs\2022-08-22T13_37_46_059Z-debug-0.log \

Here's the package.json file:

"dependencies": {
  "@agm/core": "^1.1.0",
  "@angular/animations": "~9.1.12",
  "@angular/cdk": "^10.0.2",
  "@angular/common": "~9.1.12",
  "@angular/compiler": "~9.1.12",
  "@angular/core": "~9.1.12",
  "@angular/forms": "~9.1.12",
  "@angular/platform-browser": "~9.1.12",
  "@angular/platform-browser-dynamic": "~9.1.12",
  "@angular/platform-server": "~9.1.12",
  "@angular/router": "~9.1.12",
  "@kolkov/angular-editor": "^1.1.4",
  "@ng-select/ng-select": "^5.0.9",
  "@nguniversal/express-engine": "^9.1.1",
  "angular-agora-rtc": "^0.1.0",
  "angular-bootstrap-scrolling-tabs": "^1.2.0",
  "angular2-datatable-pagination": "0.0.3",
  "angularx-social-login": "^3.5.7",
  "bootstrap": "^4.5.0",
  "domino": "^2.1.5",
  "express": "^4.15.2",
  "jquery": "^3.5.1",
  "mock-browser": "^0.92.14",
  "moment": "^2.27.0",
  "multiple-date-picker-angular": "^3.0.0",
  "ng-lazyload-image": "^8.0.1",
  "ngx-bootstrap": "^5.6.1",
  "ngx-cookie-service": "^3.0.4",
  "ngx-fs": "0.0.1",
  "ngx-infinite-scroll": "^10.0.1",
  "ngx-quicklink": "^0.2.3",
  "ngx-slick-carousel": "^0.5.1",
  "ngx-toastr": "^13.0.0",
  "popper": "^1.0.1",
  "rxjs": "~6.5.4",
  "slick-carousel": "^1.8.1",
  "socket.io-client": "^3.0.5",
  "ts-overlapping-marker-spiderfier": "^1.0.3",
  "tslib": "^1.10.0",
  "zone.js": "~0.10.2"
},
"devDependencies": {
  "@angular-devkit/build-angular": "~0.901.11",
  "@angular/cli": "~9.1.11",
  "@angular/compiler-cli": "~9.1.12",
  "@nguniversal/builders": "^9.1.1",
  "@types/express": "^4.17.0",
  "@types/node": "^12.11.1",
  "@types/jasmine": "~3.5.0",
  "@types/jasminewd2": "~2.0.3",
  "codelyzer": "^5.1.2",
  "jasmine-core": "~3.5.0",
  "jasmine-spec-reporter": "~4.2.1",
  "karma": "~5.0.0",
  "karma-chrome-launcher": "~3.1.0",
  "karma-coverage-istanbul-reporter": "~2.1.0",
  "karma-jasmine": "~3.0.1",
  "karma-jasmine-html-reporter": "^1.4.2",
  "protractor": "~7.0.0",
  "ts-node": "~8.3.0",
  "tslint": "~6.1.0",
  "typescript": "~3.8.3"
}

Answer 1

This is an error-related dependency conflict version mismatch between direct and indirect dependency with incorrect and broken dependency.

Couple of ways that you can try:

1. Follow the below steps:

• Downgrade the npm version to the previous version
• remove the node_modules folder
• remove package-lock.json
• please do npm install one more time to do a fresh installation of the dependency

2. Another way is, Run npm install with –force or –legacy-peer-deps option to set peer dependencies to resolve automatically. npm install --legacy-peer-deps