How can I link my CSS styles without getting MIME error

Question

I have a Nodejs - Express - Vanillajs project and when I tested my routes the index page doesn't load CSS and have this error:

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

in the browser console. I tried it with Chrome, Chromium and Firefox as well. My folder structure is:

server.js
public
|-css
  |style.css

I'm using MVC architecture and my view engine is index.html CSS is linked with

 <link rel="stylesheet" type="text/css" href="../public/css/style.css" />

Answer 1

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

This error is talking about bootstrap. I think that error occurs when the file isn't found. The link returns some 404 error in html->MIME type ('text/html').

Answer 2

The problem was in my routing

app.use(express.static(__dirname + 'public'));

And I had to add a slash

app.use(express.static(__dirname + '/public'));