Currently, I am in the process of configuring a web server using express.js and socket.io. In order to streamline my project, I created a static folder to house all my stylesheets without having to send each file individually. However, as I try to link my stylesheet, I encounter this error:
Refused to apply style from 'http://localhost:3000/public/styles/index.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
This issue seems to be linked to my app.js file:
const express = require("express");
const app = express();
var server = require('http').Server(app);
var io=require('socket.io')(server);
app.use(express.static('public'));
app.get('/', function (req, res) {
res.sendFile(__dirname + '/public/views/index.html');
});
io.on('connection', function(socket){
socket.emit('chat message', {hello: 'world'});
socket.on('chat message', function (data){
console.log(data);
});
});
server.listen(3000);
The structure of my index.html page is as follows:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8>
<title>Title</title>
<link type="text/css" rel="stylesheet" href="/public/styles/index.css">
</head>
<body>
<p>yo</p>
</body>
</html>
Here is an overview of my file structure:
|-public
|-styles
-index.css
|-views
-index.html
-app.js
It appears that there could be a misconfiguration with my server setup. This project marks my initial venture into utilizing Node.js.