Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
571 views
in Technique[技术] by (71.8m points)

javascript - MIME type error with express.static and CSS files

I'm using express and node. In my server.js file I have this piece of code:

app.use(express.static('/static'));

And subsequently in my static directory, I have a CSS folder, and then a style.css file. In my index.html, I link to the sheet like so:

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

However, in my local host I continue to get this error:

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

I am sure that my path name in my tag is right, and I'm confused to why I'm getting this error. Do I need to declare that CSS files be processed as CSS and not HTML? Am I not doing that when I say type="text/CSS"? If not, what do I need to put into my server file to remedy this issue?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)
app.use(express.static('/static'));

means that the static files are served literally from /static. In a Unix-Based Operating System, this is a direct child to the directory root /. I don't think you do, but you shouldn't store files, let alone publicly accessible files in that directory. Instead what you are probably looking for is the static directory in your App's directory.

This is how you can tell express to use that one to server files:

app.use(express.static(__dirname + "/static"));

The MIME Type Error is happening because the file served is likely a "404 Not Found" page made by Express, because it couldn't locate the CSS file. The browser expects a CSS file, gets an HTML file and says the MIME Type doesn't fit.

If you can't include a file in your HTML always double, or better even tripple check, that the file can be accessed through the browser first.

Also, the files are then located in ... href="/...", not ... href="/static/..."


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...