Angular 7 children components style is not working

Viewed 1212

When I reload my angular children component the page gets white and I'm getting an error

Refused to apply style from '[URL]' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

So as long as I route through my page by clicking buttons that change my routerLink everything works.


Update

I have this error only in production mode so when I use ng serve I can reload my page and I don't get any errors and in the Developer Tools I also see all files in the Source tab, which is not the case when I inspect the page in production mode


I've already

  • changed

    <link rel="stylesheet" href="styles.9eca5df2f679ed98933c.css">
    

    to

    <link rel="stylesheet" type="text/css" href="styles.9eca5df2f679ed98933c.css">
    
  • build my project with vendorChunk=true in my angular.json

  • commented every related html and css out

  • removed any comments in my stylesheets

  • set encapsulation: ViewEncapsulation.None on both, parent and child

  • checked <base href="/"> in my index.html <head> tag and changed it to <base href="./"> because otherwise nothing works


I guess there is no stylesheet at [URL] but I don't know why and how I can specify the URL to the related stylesheet, because styleUrls: ['./dashboard.component.css'] in the @Component-Decorator does obviously not work when I build my project in production mode (--prod).

By the way I don't use any external stylesheets, as this may be the cause of my error I found out when I searched for this problem.

This error only occurs on children components with the following routes:

/<parent>/:id/<child>

to which a navigate by

this.router.navigate(['../server/' + guild.id + "/dashboard"], { relativeTo: this.route });  

in every browser


I would be grateful for any help

0 Answers
Related