Refused to apply style because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled in Angular

Question

I changed tailwind.min.css from href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" to local storage href="./././libs/dave2-shared/src/lib/CSS/tailwind.min.css" path but I get “Refused to apply style from 'http://ui_fb3.sym-tech.loc:4200/libs/dave2-shared/src/lib/CSS/tailwind.min.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.” error in console in Angular.

I tried changing type="text/css" and type="text/html" but nothing works.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Setting</title>
    <base href="/setting/" />
    <link href="./././shared/src/tailwind.min.css" rel="stylesheet">        
  </head>
  <body>
    <ng-root></ng-root>
  </body>
</html>

You seem to be outside of root..? That file probably is not served so you probably can’t actually request it in the browser.. (did you try..?) — MikeOne
tailwind.min.css is in "libs/dave2-shared/src/lib/CSS/tailwind.min.css" folder and index.html is inside apps/ng-admin/src. Sorry what are you suggesting to try. I didn't get that. — Karim Ali

Dano Dano · Accepted Answer · 2021-04-14T18:55:15

When Angular bundles your application for serving, it does not know, that it needs to include your css file (and it probably falls back to index.html, when it cannot find the file in the path indicated - that's the error with the incorrect MIME type, because index.html does not have the correct type for a stylesheet).

Try to add the path to the css file in angular.json - in the styles section (projects -> $project name$ -> architect -> build -> options -> styles).

Refused to apply style because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled in Angular

1 Answers