CSS not being loaded: 'MIME type mismatch, text/html'-CodePudding

As the title says, none of the CSS files I linked are being loaded. The weird part is that the CSS of another page in the same website loads just fine.
I'm using express as server and ejs as a templating engine.

EJS code:

    <link rel="stylesheet" href="./CSS/header.css">
    <link rel="stylesheet" href="CSS/index.css">
    <link rel="stylesheet" href="CSS/threads.css">
    <link rel="stylesheet" href="CSS/theme.css">

Server code(Node):

app.use(express.static(__dirname   '/views')); 
app.set('view engine', 'ejs')
.
.
.
app.get('/thread/:thread', (req, res)=>{
    const thread_starter_html = get_thread_starter()
    const thread_replies_html = get_thread_replies()
    res.render('./thread.ejs', {thread_name: req.params.thread, thread_starter: thread_starter_html, thread_replies: thread_replies_html})
})

File structure:

-/ Node Modules
|
-/ Views
|      -/CSS
|       |   -|..<css files>
|      -/JS
|       |   -|..<JS files>
|       | 
|      -|..<ejs files> 
|
-|server.js
..
..

These are the errors I get:

If anyone could help me with this, I'd appreciate it.
Thanks.

CodePudding user response：

as you can see in the error that is expecting the type of "text/html" whereas it really should be returning it as "text/css" so delete stylesheet attribute from link tag and add the type attribute

<link type="text/css" href="./CSS/header.css">

CodePudding user response：

Update
The problem got fixed when I made the following changes:

Change 1:

app.use(express.static(__dirname   '/views')); 
TO
app.use(express.static(__dirname   '/views/'));

Change 2:

 <link rel="stylesheet" href="./CSS/header.css">
  ...
TO 
 <link rel="stylesheet" href="/CSS/header.css">
  ...