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

I just ran into the same issue. It appears to be a quirk of Express that can manifest itself for a few different reasons, judging by the number of hits from searching the web for "nodejs express css mime type".

Despite the type="text/css" attribute we put in our elements, Express is returning the CSS file as

Content-Type: "text/html; charset=utf-8"

whereas it really should be returning it as

Content-Type: "text/css"

For me, the quick and dirty workaround was to simply remove the rel= attribute, i.e., change

to

Testing confirmed that the CSS file was downloaded and the styles did actually work, and that was good enough for my purposes.