How to resolve dependency conflict while installing Bootstrap using Angular CLI command?

Question

I tried to install Bootstrap in my Angular application by using the CLI command: ng add @ng-bootstrap/ng-bootstrap. But I got the following errors in return. How to resolve these dependency conflict while installing Bootstrap using Angular CLI command? enter image description here

Answer 1

The problem

Your problem is due to an upstream peer dependency version conflict where @ng-bootstrap/ng-bootstrap@12.1.2 (upstream) has a peer dependency of @angular/common@^13.0.0 (downstream). Please research Peer Dependencies

Also check @ng-bootstrap/ng-bootstrap dependencies

You have a number of options:

Option 1 - Ignore the peer dependency version (at your peril)

Install using --legacy-peer-deps switch to "...accept a potentially broken dependency resolution." (as per the error message). This will mean that the package developer of @ng-bootstrap/ng-bootstrap@12.1.2 will/should have tested this with @angular/common@^13.0.0.

npm install @ng-bootstrap/ng-bootstrap --legacy-peer-deps

Option 2 - Downgrade your Angular project to a compatible version (13)

Either install Angular v13 globally npm install -g @angular/cli@13.n.n and create new project ng new project or if you have already created a project you could adjust the versions in package.json accordingly and npm install or use npx

Also check this Fix the upstream dependency conflict while installing ng-bootstrap/ng-bootstrap