I'm working on a project with Angular 17 and I've decided to use Angular Materials, the problem is, I cannot install it. Here's what the terminal says:
The package @angular/material@17.3.10 will be installed and executed.
Would you like to proceed? Yes
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: @ngrx/store@18.0.2
npm ERR! Found: @angular/core@17.3.3
npm ERR! node_modules/@angular/core
npm ERR! peer @angular/core@"17.3.3" from @angular/animations@17.3.3
npm ERR! node_modules/@angular/animations
npm ERR! peerOptional @angular/animations@"17.3.3" from @angular/platform-browser@17.3.3
npm ERR! node_modules/@angular/platform-browser
npm ERR! peer @angular/platform-browser@"17.3.3" from @angular/forms@17.3.3
npm ERR! node_modules/@angular/forms
npm ERR! peer @angular/forms@"^17.0.0" from @ng-bootstrap/ng-bootstrap@16.0.0
npm ERR! node_modules/@ng-bootstrap/ng-bootstrap
npm ERR! 2 more (the root project, @angular/material)
npm ERR! 5 more (@angular/platform-browser-dynamic, ...)
npm ERR! peer @angular/animations@"17.3.3" from @angular/platform-server@17.3.3
npm ERR! node_modules/@angular/platform-server
npm ERR! peerOptional @angular/platform-server@"^17.0.0" from @angular-devkit/build-angular@17.3.3
npm ERR! node_modules/@angular-devkit/build-angular
npm ERR! dev @angular-devkit/build-angular@"^17.3.1" from the root project
npm ERR! 1 more (the root project)
npm ERR! 2 more (the root project, @angular/material)
npm ERR! peer @angular/core@"17.3.3" from @angular/common@17.3.3
npm ERR! node_modules/@angular/common
npm ERR! peer @angular/common@"17.3.3" from @angular/forms@17.3.3
npm ERR! node_modules/@angular/forms
npm ERR! peer @angular/forms@"^17.0.0" from @ng-bootstrap/ng-bootstrap@16.0.0
npm ERR! node_modules/@ng-bootstrap/ng-bootstrap
npm ERR! @ng-bootstrap/ng-bootstrap@"^16.0.0" from the root project
npm ERR! 2 more (the root project, @angular/material)
npm ERR! peer @angular/common@"17.3.3" from @angular/platform-browser@17.3.3
npm ERR! node_modules/@angular/platform-browser
npm ERR! peer @angular/platform-browser@"17.3.3" from @angular/forms@17.3.3
npm ERR! node_modules/@angular/forms
npm ERR! peer @angular/forms@"^17.0.0" from @ng-bootstrap/ng-bootstrap@16.0.0
npm ERR! node_modules/@ng-bootstrap/ng-bootstrap
npm ERR! 2 more (the root project, @angular/material)
npm ERR! 5 more (@angular/platform-browser-dynamic, ...)
npm ERR! 13 more (@angular/platform-browser-dynamic, ...)
npm ERR! 17 more (@angular/compiler, @angular/forms, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/core@"^18.0.0" from @ngrx/store@18.0.2
npm ERR! node_modules/@ngrx/store
npm ERR! @ngrx/store@"^18.0.2" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: @angular/core@18.2.3
npm ERR! node_modules/@angular/core
npm ERR! peer @angular/core@"^18.0.0" from @ngrx/store@18.0.2
npm ERR! node_modules/@ngrx/store
npm ERR! @ngrx/store@"^18.0.2" 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!
npm ERR! For a full report see:
npm ERR! C:\Users\germa\AppData\Local\npm-cache\_logs\2024-09-04T18_44_13_289Z-eresolve-report.txt
npm ERR! A complete log of this run can be found in: C:\Users\germa\AppData\Local\npm-cache\_logs\2024-09-04T18_44_13_289Z-debug-0.log
ā Packages installation failed, see above.
I still do not know how to work with npm conflicts
I tried to see what can be causing the conflict. I have installed bootstrap
, ngbootstrap
, and others like ngxtranslate
and rxjs
. I tried to use --force
but nothing.
Upgrade to angular 18 or downgrade @ngrx/store to 17.X.X
Your library @ngrx/store@18.0.2 is compatible with angular 18, not angular 17. It must have been force installed. You should start by fixing that issue