由于 MIME 类型而未加载样式表

Stylesheet not loaded because of MIME-type(由于 MIME 类型而未加载样式表)

问题描述

我正在开发一个使用 gulp 进行编译和浏览器同步的网站，以使浏览器与我的更改保持同步.

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

gulp 任务可以正确编译所有内容，但是在网站上，我看不到任何样式，并且控制台显示此错误消息:

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

拒绝应用样式来自'http://localhost:3000/assets/styles/custom-style.css' 因为它MIME 类型 ('text/html') 不是受支持的样式表 MIME 类型，并且已启用严格的 MIME 检查.

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.

HTML 包含这样的文件(我很确定这是正确的):

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"/>

样式表是 Bootstrap 和目前字体很棒的样式(还没有自定义).

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.

可能是什么?这可能是 gulp/browsersync 的东西(可能是设置?)?

What could it be? Is this something (maybe a setting?) for gulp/browsersync maybe?

推荐答案

我已将我的 href 更改为 src.所以从这里:

I have changed my href to src. So from this:

<link rel="stylesheet" href="dist/photoswipe.css">

到这里:

<link rel="stylesheet" src="dist/photoswipe.css">

成功了.我不知道为什么，但它确实起到了作用.

It worked. I don't know why, but it did the job.

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