由于MIME类型，样式表未加载 [英] Stylesheet not loaded because of MIME-type

问题描述

我正在使用gulp进行编译和浏览器同步的网站上工作，以保持浏览器与我的更改同步。

gulp任务正确编译所有内容，但在网站上我无法看到任何样式，并且控制台显示以下错误消息：

拒绝应用$ b $的样式b' http：// localhost：3000 / assets / styles / custom-style.css '，因为它的
MIME类型（'text / html'）不是受支持的样式表的MIME类型，并且启用了
严格的MIME检查。

现在，我不明白为什么会发生这种情况。

HTML包含这样的文件（我很确定是正确的）：

 < link rel =stylesheettype =text / csshref =assets / styles /定制的style.css/> 
  

并且样式表是bootstrap&字体真棒样式现在（没有自定义）。

路径也是正确的，因为这是文件夹结构：

  index.html 
资产
 | -styles 
 | -custom-style.css 
  

BUt我不断收到错误信息。

不知道它可能是什么？这是什么东西（也许是一个设置？）​​的gulp / browsersync也许？

任何帮助真的很感激，并随时要求更多的细节，如果需要。 >

谢谢

解决方案

好的，我想我找到了一个解决方案，它在这里以帮助别人。

我认为这是一个以注释开头的CSS库。
在开发中，我不会删除文件，也不会删除注释，这意味着样式表开始时带有一些注释，导致它被视为与CSS不同。

删除该库并将其放入供应商文件（始终无需注释即可缩小）解决了此问题。再次，我不是100 ％肯定这是一个修复，但它仍然是一个胜利，因为它现在按预期工作。

I'm working on a website that uses gulp to compile and browser sync to keep the browser synced with my changes.

The gulp task compiles everything properly, but on the website i'm unable to see any style, and the console shows this error message:

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

Now, I don't really understand why this happens.

The HTML includes the file like this (which I am pretty sure is correct):

<link rel="stylesheet" type="text/css" href="assets/styles/custom-style.css"/>

and the stylesheet is a merge between bootstrap & font-awesome styles for now (nothing custom yet).

The path is correct as well, as this is the folder structure:

index.html
assets
|-styles
  |-custom-style.css

BUt i keep getting the error.

Any idea what it could be? is this something (maybe a setting?) for gulp/browsersync maybe?

Any help is really appreciated, and feel free to ask for more details if needed.

Thanks

解决方案

Ok I think I found a solution and I'm writing it here in case helps somebody else.

The issue i think it was with a CSS library starting with comments. While on dev, i do not minify files and i don't remove comments, this meant that the stylesheet started with some comments, causing it to be seen as something different from css.

Removing the library and putting it into vendor file (which is ALWAYS minified without comments) solved the issue.

Again, i'm not 100% sure this is a fix, but it's still a win for me as it works as expected now.

这篇关于由于MIME类型，样式表未加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！