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

Question

friends, I've spent the whole day looking for the solution to this but I haven't been able to fix it. I get this when I build it for production, in development mode (with no minification and stuff) it works well in localhost, but when I get my files in the dist folder and upload them to hosting server I get this 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.

I stopped using CDNs that have comments at the beginning, and downloader the code and saved it locally and removed all comments. (The most accepted answer here is that comments at the beginning mess up everything when the minification process occurs, but even doing that, I still get the error)

Any help will be extremely appreciated. Thanks.

You must have the page served with the 'X-Content-Type-Options' header. What is your server you are using? You need to configure it to serve the CSS files with the correct mime type or turn this header off. — ryanm
Buddy, I'm using webpack-dev-server for development purposes, but when I upload the files of my "dist" folder to my Webhosting server "000.webhost.com", it throws this error. So, I don't know what server uses "000.webhost.com". :( Enlighten me please. — Julio Rodriguez
What web host are you using? There must be a way to configure the headers and mime type it sends for static files. — ryanm

Siddharth Siddharth · Accepted Answer · 2019-08-29T06:21:10

I have one way for problem solution, but you need to put your css in .php file under style tag.


    //PHP code for get server url put it at top of in .php file

    $base_url = '://'. $_SERVER['HTTP_HOST'].'/'; //URL for server(CDN)
    $image_url = 'assets/image/';
    $url_for_image_dir = $base_url.$image_url;

HTML content

<html>
    <head>
        <title>css for url</title>                    
    </head>
    <body>
        <style>
            .slider-image{  background-image: url("<?php echo $url_for_image_dir;?>embouchure.jpg"); }
        </style>
        <div class="slider-image"></div>
    </body>
</html>

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

1 Answers