1

Trying to run this in my Angular project

ng add @ng-bootstrap/ng-bootstrap

Get this error though and don't know how to fix

npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: @angular/[email protected]
npm ERR! node_modules/@angular/compiler
npm ERR!   @angular/compiler@"^15.0.0" from the root project
npm ERR!   peer @angular/compiler@"15.0.4" from @angular/[email protected]
npm ERR!   node_modules/@angular/compiler-cli
npm ERR!     dev @angular/compiler-cli@"^15.0.0" from the root project
npm ERR!     peer @angular/compiler-cli@"^15.0.0" from @angular-devkit/[email protected]
npm ERR!     node_modules/@angular-devkit/build-angular
npm ERR!       dev @angular-devkit/build-angular@"^15.0.4" from the root project
npm ERR!     1 more (@ngtools/webpack)
npm ERR!   1 more (@angular/platform-browser-dynamic)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! dev @angular/localize@"^15.0.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: @angular/[email protected]
npm ERR! node_modules/@angular/compiler
npm ERR!   peer @angular/compiler@"15.1.0" from @angular/[email protected]
npm ERR!   node_modules/@angular/localize
npm ERR!     dev @angular/localize@"^15.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.

✖ Package install failed, see above.
The Schematic workflow failed. See above.
4
  • try to run ng add @ng-bootstrap/ng-bootstrap --force command. Commented Jan 13, 2023 at 6:14
  • No, I wanted to fix the issue rather than force it. Thanks anyway. Commented Jan 16, 2023 at 3:19
  • No fixes for this. I have moved on though and just created a new project and added bootstrap first and all ok so don't really need this anymore. What is the protocol with the question? Commented Jan 18, 2023 at 6:39
  • I have the same issue. I'm using angular 15.1.0 in a new project, and i'm getting the same error. I tried using --force and it didn't solve the problem. Commented Feb 13, 2023 at 14:29

3 Answers 3

1

Here you have related the versions of ng-bootstrap for each version of Angular.

ng-bootstrap Angular bootstrap.css Poper
9.x.x         11.0.0    4.5.0   
10.x.x        12.0.0    4.5.0   
11.x.x        13.0.0    4.6.0   
12.x.x        13.0.0    5.0.0       2.10.2
13.x.x        14.1.0    5.2.0       2.10.2
14.x.x        15.0.0    5.2.3       2.11.6

So, if your app is in Angular 13, e.g. you need instal ng-bootstrap 12.x.x

ng add @ng-bootstrap/[email protected]

See that in this link you have the "changelog", so choose the bigger version according your version of Angular

NOTE: Perhaps you prefer upgrade your app to the most higher Angular version

Sign up to request clarification or add additional context in comments.

1 Comment

Thanks sounds promising. I am using Angular 15.1.0 and tried ng-bootstrap 14.0.0 and 14.0.1 but no luck. I did create a brand new Angular project and then add bootstrap straight away before anything else and that was ok just struggling with an existing app.
0

I think you can try to delete "node_modules" folder and "package-lock.json" as well, and then run npm i

Comments

0

Install bootstrap using npm : npm i bootstrap . And then in angular.json file-> inside "styles" array add "node_modules/bootstrap/dist/css/bootstrap.min.css" and inside script array add "node_modules/bootstrap/dist/js/bootstrap.min.js"

1 Comment

it's related to ng-bootstrap, not to bootstrap.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.