build failing when mathjax-angular is used in prod ci/cd pipeline

[mratanusarkar]

I have an angular project where I am trying to use mathjax-angular. Here are the versions that my project is using:

• node version: v16.20.0
• npm version: 8.19.4
• angular version: ^15.2.0
• angular material version: ^15.2.3

I got the library working locally using npm install mathjax-angular --force, (according to #26) but, unfortunately, my github workflows ci/cd pipeline is failing with the following error:

Running 'npm install'...

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: mathjax-angular@2.1.1
npm ERR! Found: @angular/common@15.2.3
npm ERR! node_modules/@angular/common
npm ERR!   @angular/common@"^15.2.0" from the root project
npm ERR!   peer @angular/common@"^15.0.0 || ^16.0.0" from @angular/cdk@15.2.3
npm ERR!   node_modules/@angular/cdk
npm ERR!     @angular/cdk@"^15.2.3" from the root project
npm ERR!     peer @angular/cdk@"15.2.3" from @angular/material@15.2.3
npm ERR!     node_modules/@angular/material
npm ERR!       @angular/material@"^15.2.3" from the root project
npm ERR!   6 more (@angular/forms, @angular/material, ...)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/common@"^14.0.0" from mathjax-angular@2.1.1
npm ERR! node_modules/mathjax-angular
npm ERR!   mathjax-angular@"^2.1.1" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: @angular/common@14.3.0
npm ERR! node_modules/@angular/common
npm ERR!   peer @angular/common@"^14.0.0" from mathjax-angular@2.1.1
npm ERR!   node_modules/mathjax-angular
npm ERR!     mathjax-angular@"^2.1.1" 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! See /github/home/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /github/home/.npm/_logs/2023-06-15T14_05_25_305Z-debug-0.log

---End of Oryx build logs---
Oryx has failed to build the solution.

For further information, please visit the Azure Static Web Apps documentation at https://docs.microsoft.com/en-us/azure/static-web-apps/
If you believe this behavior is unexpected, please raise a GitHub issue at https://github.com/azure/static-web-apps/issues/
Exiting

I can have a quick fix by updating my workflows file with npm install --force in place of npm install (according to this StackOverflow Post),

but that would be a bad practice (I guess), especially when the ci/cd pipeline file/script is maintained by a 3rd Party for Cloud Service (Azure DevOps in my case), it gets difficult to override the deployment script.

Any suggestions, fixes, or help for this issue would be really helpful.

[raztirlea]

Hello, I am encountering same issue, have you tested this library on angular 16 by any chance?

[sajivkumar]

no not on 16.. let me see if I can generate one for 16!..

[mratanusarkar]

@raztirlea In the meantime this get's a permanent fix, I resolved the blocker with suggestions from: Azure Issue #980 comment

Anyone using Azure DevOps CI, encountering this issue can use this as a temporary fix.

[raztirlea]

I tried with angular 16 and it works well can confirm. Just still have to do the workaround that you said but as long as mathjax is the only forced peer deps and no others are forced then it is kind of acceptable for the moment.

[mratanusarkar]

@raztirlea Indeed, using npm install --force or --legacy-peer-deps in the DevOps pipeline does the trick. However, the challenge is that these flags apply globally to all npm packages, not just mathjax-angular.

If you or anyone else knows how to apply these flags exclusively to specific packages, while using a standard npm install for the remaining packages in package.json, I'd appreciate any insights.

[marcinstl]

I am having the same issue.

@sajivkumar Could you update the peerDependecies to following?

"peerDependencies": {
    "@angular/common": ">=14.0.0",
    "@angular/core": ">=14.0.0"
  }

It is working well with Angular 17, so I think there are no breaking changes in Angular, that would affect this library.

[mratanusarkar]

I checked on this, and the issue still exists. In local, this is the error stack (for reference):

D:\My Workspace\GitHub\DemoProject>npm i
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: mathjax-angular@2.1.1
npm ERR! Found: @angular/common@15.2.3
npm ERR! node_modules/@angular/common
npm ERR!   @angular/common@"^15.2.0" from the root project
npm ERR!   peer @angular/common@"^15.0.0 || ^16.0.0" from @angular/cdk@15.2.3
npm ERR!   node_modules/@angular/cdk
npm ERR!     @angular/cdk@"^15.2.3" from the root project
npm ERR!     peer @angular/cdk@"15.2.3" from @angular/material@15.2.3
npm ERR!     node_modules/@angular/material
npm ERR!       @angular/material@"^15.2.3" from the root project
npm ERR!   6 more (@angular/forms, @angular/material, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/common@"^14.0.0" from mathjax-angular@2.1.1
npm ERR! node_modules/mathjax-angular
npm ERR!   mathjax-angular@"^2.1.1" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: @angular/common@14.3.0
npm ERR! node_modules/@angular/common
npm ERR!   peer @angular/common@"^14.0.0" from mathjax-angular@2.1.1
npm ERR!   node_modules/mathjax-angular
npm ERR!     mathjax-angular@"^2.1.1" 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\Atanu sarkar\AppData\Local\npm-cache\_logs\2024-01-20T05_04_42_060Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Atanu sarkar\AppData\Local\npm-cache\_logs\2024-01-20T05_04_42_060Z-debug-0.log

[mratanusarkar]

@sajivkumar raised a PR to solve this issue. Please review, verify, and merge to solve this long-standing issue.

[sajivkumar]

https://github.com/sajivkumar/mathjax-angular/pull/30