How to understand and fix this npm dependency issue with rxjs when updating Angular

I spent hours reading about npm dependencies issues here, but I still don't really understand most dependencies error messages, they often don't really make sense and sometimes the dependency constraints should work with the version found.

For example, I still don't understand the error I have :

While resolving: myproject.front@0.0.0
Found: rxjs@7.8.2
node_modules/rxjs
rxjs@"7.8.2" from the root project
rxjs@">=7.5.0" from @fronts/ui-dynamic-components@24.295.2
node_modules/@fronts/ui-dynamic-components
@fronts/ui-dynamic-components@"^24.295.2" from the root project
peer rxjs@"^6.5.3 || ^7.4.0" from @angular/common@19.2.14
node_modules/@angular/common
@angular/common@"19.2.14" from the root project
peer overridden @angular/common@"19.2.14" (was "^17.0.0 || ^16.0.0") from @fronts/ui-dynamic-components@24.295.2
node_modules/@fronts/ui-dynamic-components
@fronts/ui-dynamic-components@"^24.295.2" from the root project

Could not resolve dependency:
peer rxjs@"^6.5.3 || ^7.4.0" from @angular/core@19.2.14
node_modules/@angular/core
@angular/core@"19.2.14" from the root project
peer overridden @angular/core@"19.2.14" (was "^17.0.0 || ^16.0.0") from @fronts/ui-dynamic-components@24.295.2
node_modules/@fronts/ui-dynamic-components
@fronts/ui-dynamic-components@"^24.295.2" from the root project
peer @angular/core@"19.2.14" from @angular/common@19.2.14
node_modules/@angular/common
@angular/common@"19.2.14" from the root project
peer overridden @angular/common@"19.2.14" (was "^17.0.0 || ^16.0.0") from @fronts/ui-dynamic-components@24.295.2
node_modules/@fronts/ui-dynamic-components
@fronts/ui-dynamic-components@"^24.295.2" from the root project

Fix the upstream dependency conflict, or retry
this command with --force or --legacy-peer-deps
to accept an incorrect (and potentially broken) dependency resolution.


@fronts/ui-dynamic-components is an internal lib that I can't change which has Angular 16 & 17 as dependency, but we override it to Angular 19, as it still works.

What I understand from the message is that there are 2 libs that depend on rxjs:

• @fronts/ui-dynamic-components@24.295.2 which require rxjs@">=7.5.0"
• @angular/core@19.2.14 which require rxjs@"^6.5.3 || ^7.4.0"

The project has rxjs@7.8.2 defined.

What I don't understand, is that rxjs@7.8.2 should work with those constraints !
It satisfies rxjs@">=7.5.0" and rxjs@"^6.5.3 || ^7.4.0" I even tested it with https://semver.npmjs.com to be sure.

I don't like to use --force or --legacy-peer-deps because I don't like to ignore an error or a warning. Especially if I don't understand it.

Any tip on what is going on ? When is it "safe" to use --legacy-peer-deps ?

I'm using Node v22.19.0 and NPM v11.4.2

Continue reading...