Why cant i install Angular Bootstrap? - node.js

Question

Angular CLI: 14.2.3
Node: 16.15.1
Package Manager: npm 8.12.1
OS: darwin x64
I am installing angular bootstrap (trying to) getting the following error from NPM
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: tractapp#0.0.0
npm ERR! Found: #angular/core#14.2.2
npm ERR! node_modules/#angular/core
npm ERR! peer #angular/core#"14.2.2" from #angular/animations#14.2.2
npm ERR! node_modules/#angular/animations
npm ERR! peer #angular/animations#"^14.0.0 || ^15.0.0" from #angular/material#14.2.2
npm ERR! node_modules/#angular/material
npm ERR! #angular/material#"^14.2.2" from the root project
npm ERR! peerOptional #angular/animations#"14.2.2" from #angular/platform-browser#14.2.2
npm ERR! node_modules/#angular/platform-browser
npm ERR! peer #angular/platform-browser#"^12.0.0 || ^13.0.0 || ^14.0.0" from #angular/fire#7.4.1
npm ERR! node_modules/#angular/fire
npm ERR! #angular/fire#"^7.4.1" from the root project
npm ERR! 6 more (#angular/forms, #angular/material, ...)
npm ERR! 2 more (#swimlane/ngx-charts, the root project)
npm ERR! peer #angular/core#"^14.0.0 || ^15.0.0" from #angular/cdk#14.2.2
npm ERR! node_modules/#angular/cdk
npm ERR! peer #angular/cdk#"14.2.2" from #angular/material#14.2.2
npm ERR! node_modules/#angular/material
npm ERR! #angular/material#"^14.2.2" from the root project
npm ERR! peer #angular/cdk#">=12.0.0" from #swimlane/ngx-charts#20.1.0
npm ERR! node_modules/#swimlane/ngx-charts
npm ERR! #swimlane/ngx-charts#"^20.1.0" from the root project
npm ERR! 2 more (ng2-charts, the root project)
npm ERR! 16 more (#angular/common, #angular/compiler, #angular/fire, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! #ng-bootstrap/ng-bootstrap#"13.0.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: #angular/core#14.2.6
npm ERR! node_modules/#angular/core
npm ERR! peer #angular/core#"14.2.6" from #angular/forms#14.2.6
npm ERR! node_modules/#angular/forms
npm ERR! #angular/forms#"^14.2.0" from the root project
npm ERR! peer #angular/forms#"^14.1.0" from #ng-bootstrap/ng-bootstrap#13.0.0
npm ERR! node_modules/#ng-bootstrap/ng-bootstrap
npm ERR! #ng-bootstrap/ng-bootstrap#"13.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 errors and how these are stated is not my strong suit of understanding, would love if someone could help me out and point me in the right direction here.
Thanks!
Heres my package.json file aswell, im assuming its something in there by the way the error is formed/stated.
{
"name": "tractapp",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"test": "ng test"
},
"private": true,
"dependencies": {
"#angular/animations": "^14.2.0",
"#angular/cdk": "^14.2.2",
"#angular/common": "^14.2.0",
"#angular/compiler": "^14.2.0",
"#angular/core": "^14.2.0",
"#angular/fire": "^7.4.1",
"#angular/forms": "^14.2.0",
"#angular/material": "^14.2.2",
"#angular/platform-browser": "^14.2.0",
"#angular/platform-browser-dynamic": "^14.2.0",
"#angular/router": "^14.2.0",
"#fortawesome/angular-fontawesome": "^0.11.1",
"#fortawesome/fontawesome-svg-core": "^6.2.0",
"#fortawesome/free-solid-svg-icons": "^6.2.0",
"#stripe/stripe-js": "^1.37.0",
"#sweetalert2/ngx-sweetalert2": "^12.0.1",
"#swimlane/ngx-charts": "^20.1.0",
"aos": "^2.3.4",
"apexcharts": "^3.35.5",
"chart.js": "^3.9.1",
"ng-apexcharts": "^1.7.1",
"ng2-charts": "^4.0.1",
"ngx-print": "^1.2.1",
"ngx-stripe": "^14.1.0",
"rxjs": "~7.5.0",
"stripe": "^10.11.0",
"sweetalert2": "^11.5.1",
"tslib": "^2.3.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"#angular-devkit/build-angular": "^14.2.3",
"#angular/cli": "~14.2.3",
"#angular/compiler-cli": "^14.2.0",
"#types/d3": "^7.4.0",
"#types/jasmine": "~4.0.0",
"jasmine-core": "~4.3.0",
"karma": "~6.4.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.2.0",
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.0.0",
"typescript": "~4.7.2"
}
}

Answer 1

Moving the comment to an answer per OP's request and so that the question can be marked resolved.
Looking at the Github releases page (accessed on 10/12/22 for v 13.0.0) the maximum support for the library currently is Angular 14.1, where as you are using 14.2.2. This seems to be a version compatibility issue (essentially the library is trying to pull an older version of Angular and you are getting a conflict)
You either have to downgrade you Angular version or use something else

Answer 2

npm update was perfect to me :D

Answer 3

Run npm update before installing ng bootstrap in your vs code terminal, that will fix it

Answer 4

I had the same problem when I added #angular/service-worker to my ionic project.
The angular version required by #angular/service-worker is different from the version installed at the beginning, and they conflict.
package-lock.json retains the version of angular that was originally installed
So, you can try to delete package-lock.json and rerun npm install