Issue when building for production with AOT compiler about angular-material-css-vars HOT 7 CLOSED

here is a brand new generated angular app I created with just angular material and your npm package installed so that you can easily see the issue. it will run fine with just ng serve, but run ng serve --prod and you will see the error with aot compilation kicks in. this replicates what we are seeing on our servers.

https://github.com/mscard02/dynamic-color-issue

from angular-material-css-vars.

I am unable to reproduce this neither with angular 8 or 9. How did you include the module to your app?

from angular-material-css-vars.

hmhm still no error with

ng serve --prod --aot

Neither with

ng build --prod --aot

Which OS are you on?

from angular-material-css-vars.

i am on windows 10 using VSCode as my code editor. The same happened to me on both my work laptop and home pc. When I mention an error, it builds correctly, but the error will show in the chrome console. I appreciate the quick responses!

from angular-material-css-vars.

I also found that setting the aot and build optimizer to false (build optimizer has to be false with aot turned off) will fix the problem and it will display in the browser with no issues.

from angular-material-css-vars.

Not really sure why that is the case. As a temporary workaround you can use:

  providers: [MaterialCssVarsService],

inside app.module.ts

from angular-material-css-vars.

Generally speaking: I doubt that this an issue of angular-material-css and rather some build weirdness going on with angular with specific versions. The service is providedIn: 'root' might be that this doesn't work so well with libraries under some circumstances. I really don't know.

from angular-material-css-vars.