未應用 CSS 文件

Question

我正在嘗試使用Buffalo構建一個網絡應用程序，但我很難弄清楚為什么我的 site.css 文件沒有被應用。

我在 Chrome 上遇到的錯誤是：

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

我試過查看 Buffalo 如何管理資產的文檔，它說：

放置在 /assets 文件夾中的任何資產都將自動復制到“發行版”，並且可以在 /assets/path/to/asset 中找到。

我鏈接樣式表的代碼如下所示：

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

關於我可能還缺少什么的任何想法？

謝謝！

Answer 1

這意味着您的服務器沒有響應具有適當 MIME 類型的此 css 文件的請求。 您可以通過請求 CSS 文件並查看原始響應來證明這一點（例如，在瀏覽器的開發人員工具中，或通過 cURL）。 你想看到的是：

text/css

但是，鑒於錯誤，您將看到的是text/plain

根據布法羅文件：

默認情況下，資產管道配置為使用 .scss 文件，以 /assets/css/application.scss 作為主要入口點。 這當然是可以改變的。

我建議您采用默認方案並使用 SCSS ，並使用Buffalo 資產助手：

stylesheetTag - 這個助手將為請求的 CSS 文件生成一個樣式標簽。 示例： <%= stylesheetTag("application.css") %>會返回類似<link href="/assets/application.bd76587ded82386f388f.css" media="screen" rel="stylesheet" />

但是如果您不想這樣做，您可以研究使用 Buffalo 提供 CSS 文件的替代配置，或者繞過 Buffalo 並在沒有它的情況下提供 CSS 文件。