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

Here's my stack

Express
Ejs
Sass (installed by 'npm install --save-dev sass' - a dev dependency)

I'm getting an error of

Refused to apply style from 'http://localhost:3000/css/style.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

my head tag is on a separate partials folder:

- views
- - partials
- - - header.ejs
- - index.ejs

my CSS is also on another folder

- public
- - css
- - - style.css
- - - style.css.map
- - - style.scss

my head tag looks like this:

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Learn Web</title>
<base href="/">
<link rel="stylesheet" href="css/style.css" type="text/css">
</head>

I render my index like this:

app.get('/', (req, res) => {
    res.render('index');
})

I tried adding <base href="/">
I tried to omit rel="stylesheet"
I tried to change the type="text/css" to type="text/html" - It got rid of the error but the styles do not apply.

Thank you in advance!

Does this answer your question? [Stylesheet not loaded because of MIME-type](https://stackoverflow.com/questions/48248832/stylesheet-not-loaded-because-of-mime-type) — jmargolisvt, Mar 28 '20 at 13:47
Is `http://localhost:3000/css/style.css` actually serving the CSS document as opposed to e.g. an HTML error message? — Álvaro González, Mar 28 '20 at 14:59
"I render my index like this:" — How do you render the CSS? — Quentin, Mar 28 '20 at 17:33
("I render my index like this:" — How do you render the CSS?) - with a — Ian Natividad, Mar 29 '20 at 06:22

score 0 · Answer 1 · answered Feb 15 '21 at 10:07

0

Adding this line to your js file will allow the local css to link: app.use(express.static(__dirname));

You can read about serving static files in Express here: http://expressjs.com/en/starter/static-files.html

answered Feb 15 '21 at 10:07

Paul Le

1

score -1 · Accepted Answer · answered Mar 29 '20 at 06:56

So i solved the issue. But it's somehow a half fix. Because I'm just starting my project when I encountered this issue. I restart my project but by using the express-generator where it automatically create an application skeleton. Then after that, I installed Sass using npm and it worked.

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

2 Answers2