未应用CSS文件

I'm trying to build a web-app using Buffalo but I'm having a difficult time figuring out why my site.css file is not being applied.

The error that I am getting on Chrome is:

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.

I've tried looking through the docs for how Buffalo manages assets, and it says:

Any assets placed in the /assets folder will be copied to the "distribution" automatically, and can be found at /assets/path/to/asset.

My code where I link the stylesheet looks like this:

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

Any ideas as to what else I could be missing?

Thanks!

double0201
double0201 <link>标记不使用或不需要斜杠,也从未使用过。
2 年多之前 回复

1个回答

That means your server is not responding to requests for this css file with the appropriate MIME type. You can demonstrate that by requesting the CSS file and viewing the raw response (in your browser's developer tools, or via cURL, for example). What you want to see is:

text/css

But, given the error, what you will see is text/plain

According to Buffalo documentation:

By default the asset pipeline is configured to use .scss files, with /assets/css/application.scss as the main entry point. This, of course, can be changed.

I suggest you adopt the default scheme and use SCSS, and use the Buffalo asset helper:

stylesheetTag - This helper will generate a style tag for the requested CSS file. Example: <%= stylesheetTag("application.css") %> would return something like <link href="/assets/application.bd76587ded82386f388f.css" media="screen" rel="stylesheet" />

but if you don't wish to do that you could look into alternative configurations for serving CSS files with Buffalo, or into getting around Buffalo and serving CSS files without it.

dtg25862
dtg25862 谢谢您的帮助! 我仔细研究了Buffalo如何使用资产助手和标记,从而解决了我的问题。 :)
2 年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问