拒绝从''应用样式，因为它的MIME类型（'text / html'）不是受支持的样式表MIME类型，并且启用了严格的MIME检查

Question

我有一个Vue.js项目，当我检查控制台时发现此问题如下：

  

拒绝从“http://localhost:8080/dist/cropper.min.css”应用样式，因为其MIME类型（'text / html'）不是受支持的样式表MIME类型，并且启用了严格的MIME检查。

我搜索过，发现了一个Angular related post，但它没有帮助我，它们基于不同的前端框架。

Answer 1

此错误消息的常见原因是，当浏览器尝试加载该资源时，服务器会返回HTML页面，例如，如果路由器捕获未知路径并显示没有404错误的默认页面。当然，这意味着路径不会返回预期的CSS文件/图像/图标/等等。

要确保您处于这种情况，请复制路径并尝试直接在新的浏览器窗口或选项卡中访问它。您将看到服务器发送的内容。

解决方案是找到正确的路径和路由器配置，以便在访问该路径时获得纯CSS文件/图像/等。

确切的路径和路由器配置取决于您如何设置项目和正在使用的框架。

Answer 2

我遇到了完全相同的问题“拒绝应用'http://localhost:8080/css/formatting.css'中的样式，因为它的MIME类型（'application / json'）不是受支持的样式表MIME类型...“

我浏览窗口浏览器，并按我的预期更正了文件路径（文件夹）。寻址中也存在拼写错误，例如路径如上所述（formatting.css或双't'），但文件实际上是format.css（单't'），问题得以解决。有些解决方案根本不贵。谢谢。

Answer 3

您提供的信息不足。但我有同样的问题，所以我有一个解决方案。

在组件的样式块中说@import css文件。所以我的问题出在我指定的路径上。由于路径错误，出现错误消息pushd lame ./configure \ --prefix=$PREFIX \ --host=$HOST \ --enable-static \ --disable-shared \ --disable-frontend \ #I just need the libraries --with-sysroot=$SYSROOT make clean make make install popd 。我认为我的src路径别名Refused to apply style在样式块中被解析，但它不是。

我所要做的就是指定~而不是/src/assets/css...

Answer 4

您必须将文件css的位置更改为目录资产 asset / style.css

，然后将这些路径放入文件index.html src / index.html

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

此外，您还必须修改样式的文件angular.json

"styles": [
              "src/assets/style.css",
              "./node_modules/materialize-css/dist/css/materialize.min.css",
            ],

Answer 5

当你在 package.json 中设置了错误的 BUILD 目录时也可能会发生这种情况。例如

// Somewhere in index.js
// Client Build directory for the Server
app.use(express.static(path.resolve(__dirname, '../this-client/**build**')));

然后是 package.json：

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm start",
    "build-package-css": "cp src/assets/css/my-this-react.css **build**/my-this-react.css",
    "build-package": "npm run build-package-css && babel src --out-dir **build**"
  },

我标记为粗体的目录应该是相同的。如果有差异，它就不会运行。