在本地开发人员上禁用chrome严格的MIME类型检查

Question

我的本地开发服务器（webpack）提供了一个CSS文件，显然是错误的mime类型。

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

有没有办法禁用它？我猜这是一个chrome设置。至少对于特定的主机。

深入研究webpack配置，如果它不做一些基本的事情，像这样通常是一个令人沮丧的牦牛剃须练习。

大多数其他答案涉及修复服务器的方法。我只想攻击这个客户端，因为服务器很顽固。

相关的：

• 禁用Chrome严格的MIME类型检查

Answer 1

我遇到了同样的问题，尝试了许多不同的方法，但问题是我没有将devServer属性添加到webpack。配置。js模块导出。

module.exports = {
    entry: src + '/js/index.js',
    output: {
        path: dist,
        filename: 'js/bundle.js'
    },
    devServer: {
        contentBase: './dist'
    }
}

在这段代码中，没有添加devServer配置，我得到了404和Mime类型的问题，

添加这个解决了错误。

希望它能帮助某人排除故障。

Answer 2

尝试硬重装或清空缓存，然后硬重装页面。

为此：

1. 打开检查。（CTRL SHIFT I）
2. 右键单击刷新按钮（在地址栏之前找到）并选择适当的选项。

Answer 3

你的问题是很久以前的，但是在谷歌上这个问题排名很高，所以我想提出几个建议。

可能是伪装的HTTP/404

错误信息可能只是误导了你。不幸的是，Google Chrome完全删除了响应，甚至删除了“网络”开发面板的预览。

MIME类型可能不正确，因为服务器正在用HTTP 404消息应答
测试：直接在浏览器中打开CSS文件的URL，或使用wget等工具获取它。

你检查路径是否正确了吗？根据您的配置，css文件可能不在原来的位置（假设webpack或其配置没有问题）。

我只能在这里盲目猜测正确的URL可能是什么
http://localhost:10001/node_modules/font-真棒/css/font真棒。min.css
http://localhost:10001/css/font-太棒了。min.css
http://localhost:10001/css/font-太棒了。min.css
http://localhost:10001/font-太棒了。min.css

检查请求标头

一般来说，不仅仅是在CSS响应的情况下：
如果通过text/html响应（例如默认的Apache404页面），请求头可以准备好优雅地回退
接受：text/css，text/plain，*/*

但是您不应该将*/*配置为每个请求都可以接受。即使在本地开发环境中，它也不总是有用的——错误类型的响应应该尽早修复。

为什么框架想要优雅地处理这一点

服务器可能会传递正确的答案，但标题不正确。该框架假设服务器“必须意味着应用程序/json”，并让JSON解析器对其进行分析。

如果这样做有效，框架只需忽略不正确的内容类型，即可继续运行
其目标主要是在共享主机环境中运行，其中编辑。htaccess设置可能无法进行
如果您的应用程序处理内容类型更严格，但有时会出现这样的调试错误，这也没关系。

相关答案
如果这没有帮助，这里的答案对我很有帮助：
样式表没有加载，因为MIME类型