Rails 不显示背景图像

Question

我有自定义 CSS 文件 style.css，不在 application.css 中：

background-image: url('book.png');

我做到了

rake assets:precompile RAILS_ENV=production

但它不显示图像。我还授予了图像（755）的权限。我该如何解决？

并且控制台没有错误

log/production.log

I, [2014-12-24T01:22:04.323979 #27157]  INFO -- : Started GET "/login" for 81.21.82.67 at 2014-12-24 01:22:04 -0500
I, [2014-12-24T01:22:04.329702 #27157]  INFO -- : Processing by BookController#login as HTML
I, [2014-12-24T01:22:04.333589 #27157]  INFO -- :   Rendered book/login.html.erb within layouts/application (1.0ms)
I, [2014-12-24T01:22:04.334700 #27157]  INFO -- : Completed 200 OK in 5ms (Views: 2.9ms | ActiveRecord: 0.0ms)

当我从浏览器 http://example.com/assets/book.jpg 打开时，它也无法打开

Answer 1

预编译后图片路径会发生变化，所以你需要使用asset_path从asset获取正确的图片路径。

如果你使用asset_path，那么预编译后很容易得到图像。

使用这个：

background-image: asset_path('book.png');

代替：

background-image: url('book.png');

Answer 2

假设 book.png 是本地图片，可能需要做两处更改：

一个。将style.css 更改为style.css.scss

b.将background-image: url('book.png'); 替换为background-image: image-url('book.png');

这可确保 CSS 使用 book.png 图像的完整资源 URL。

Answer 3

Guides are your friends.

问题在于资产管道中的资产被重命名以包含反映其内容的校验和。问题在于，指向实际图像的链接与您期望的不同。仅在生产中，因为资产仅针对生产环境进行了预编译。在开发中没有问题，因为资产在任何更改后都会在原地重新编译，并使用尽可能减少可能缓存的参数提供服务。

这是为了更大的利益。 这样做的结果是，如果文件在新版本中发生更改，则在提供时会获得不同的名称（即使您没有自己重命名），因此浏览器和缓存系统会立即检测到更改并请求新资产。缓存失效没有痛苦。

资源预编译时使用ERB，您可以通过在文件名中添加.erb来使用它，例如login.css.erb。有an example in the guides。

.class {
  background-image: url(<%= asset_path 'image.png' %>)
}

指南甚至描述了一种将图像直接嵌入到 base64 中的 CSS 的方法。它适用于链接 PNG 图标的小图片，请求少了一个，图片大小仅增加了 33%。

#logo {
  background: url(<%= asset_data_uri 'logo.png' %>)
}