Hello Guys, How are you all? Hope You all Are Fine. Today I am facing following error: MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled in HTML. So Here I am Explain to you all the possible solutions here.
Without wasting your time, Let’s start This Article to Solve This Error.
How This Error Occurs ?
I am facing following error.
Refused to apply style from ‘http://localhost:3000/assets/styles/my-custom-style.css’ because its MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled.
How To Solve MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled Error ?
- How To Solve MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled Error ?
To Solve MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled ErrorTry To remove rel=”stylesheet” from link Tag. Suppose Here is my example link tag: <link href=”my-custom.css” rel=”stylesheet”> # I am facing Error But If I am removing rel=”stylesheet” tag Then My error was solved <link href=”starter-template.css”> # Working fine Now, My error is solved successfully.
- MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled
To Solve MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled ErrorJust make Sure Your File name and the name You are Using in Link Tag Both Are Same. For Example my File name is style.css Then My Link tag is Something like this:<link rel=”stylesheet” href=”style.css”> #RightBut If You are use styles.css then You will face same error: <link rel=”stylesheet” href=”styles.css”> #Wrong It Will Give Error Hope, Now Your error should be solved.
Solution 1: Check File name
Just make Sure Your File name and the name You are Using in Link Tag Both Are Same. For Example my File name is style.css Then My Link tag is Something like this.
<link rel="stylesheet" href="style.css"> #Right
But If You are use styles.css then You will face same error.
<link rel="stylesheet" href="styles.css"> #Wrong It Will Give Error
Hope, Now Your error should be solved.
Solution 2: Remove rel=”stylesheet”
Try To remove rel=”stylesheet” from link Tag. Suppose Here is my example link tag.
<link href="my-custom.css" rel="stylesheet"> # I am facing Error
But If I am removing rel=”stylesheet” tag Then My error was solved
<link href="starter-template.css"> # Working fine
Now, My error is solved successfully.
Solution 3: For Nodejs
If You are using Nodejs Then You need to check your configuration. If You have Your dirname just like this.
app.use(express.static(__dirname + '/public'));
Then You Have to Use
<link href="/css/style.css">
If You have dirname Just like this.
app.use(express.static(__dirname + '/public/'));
Then You Probebly need to use.
<link href="css/style.css">
Now, Your error must be solved.
Summary
It’s all About this issue. Hope all solution helped you a lot. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you?
Also, Read
Removing rel=”stylesheet” tag in index.html works for me. Thanks a lot.
My pleasure to help You David WANG