CSS file blocked: MIME type mismatch (X-Content-Type-Options: nosniff)

Question

I am developing an Angular 4 app and I want to apply some global styles. Following the tutorial at the angular site, I\'ve created a \"styles.css\" file in the root directo

Answer 1

In running into the same kind of issue for a full stack web application (in development), I simply solved the problem by correctly linking the css file to the page rendered. Removing the rel = stylesheet, as suggested above, prevents the error to show up in the browser but it does not load the styles that should be applied to the page. In short, it isn't a solution.

If you are using express-static you can use this as an example:

Server-side:

app.use(express.static(__dirname + "/public", {
    index: false, 
    immutable: true, 
    cacheControl: true,
    maxAge: "30d"
}));

Client-side:

Just add a forward slash in front of the file you wish to link to the html page (if you are rendering html pages without using any template engines) and express-static will do the rest automatically for you.