确实会发出样式表的网络请求，但不适用于 HTML

Question

这是最初的情况（来自 Firefox 开发者工具的截图）。 header 中有一个<link rel="stylesheet"> 。 注意没有任何 styles 应用于<body>元素（下视口）。 正如您在第二张图片中看到的那样，对这个样式表的 web 请求实际上已经完成：

如果我将 go 到 Firefox 开发者工具中的Style Editor选项卡并添加一个额外的字符（在这种情况下，在import和body之间有一个换行符），这会导致 Firefox 更新样式表，当发生这种情况时，ZBC4150D0671D671D3253F2网页。

如何确保我的 styles 在页面加载时得到应用？

编辑：我应该提到，在使用create-react-server的开发服务器测试我的应用程序或使用python3 -m http.server作为 web 服务器时，我没有遇到这些问题。 仅当我使用 nginx 作为服务器时才会发生这种情况，尽管我无法想象服务器可能会产生什么不同，因为所有 web 服务器都返回完全相同的 static 内容。

Answer 1

问题是我的 web 服务器正在发送 MIME 类型的text/plain而不是text/css 。 我通过添加include mime.types; 到nginx.conf中的html元素并创建具有以下内容的mime.types文件：

types {
  text/html                             html htm shtml;
  text/css                              css;
  text/javascript                       js;
}

这似乎是使用 docker 的nginx:latest图像的人的常见问题。

确实会发出样式表的网络请求，但不适用于 HTML

问题描述

1 个解决方案

解决方案1
0 2019-11-13 21:07:43

确实会发出样式表的网络请求，但不适用于 HTML

问题描述

1 个解决方案

解决方案1 0 2019-11-13 21:07:43

解决方案1
0 2019-11-13 21:07:43