Question

例如，在我的Rails应用程序中，我有类似的东西：

.wax_seal {
  background: url("wax-seal-small.png");
  display: block;
  height: 100px;
  margin: 0 auto;
  width: 92px;
}

.wax_seal:active {
  background: url('wax-seal-small-broken.png');
}

在我的config/environments/production.rb文件中：

# Disable Rails's static asset server (Apache or nginx will already do this).
config.serve_static_assets = true

我手动调用资产编译：

bundle exec rake assets:precompile

并且在名称末尾使用哈希创建文件：

wax-seal-small-Uuhqwduhqwdoi234983jewf.png

所以这不起作用：

background: url("wax-seal-small.png");

但这样可行（当我手动在Chrome中输入时）：

background: url("wax-seal-small-Uuhqwduhqwdoi234983jewf.png");

我在这里错过了什么步骤？如何让我的CSS规则添加到那个小哈希？

在config.assets.compile = true中添加config/environments/production.rb会使其正常工作，但我在Rails指南中读到，由于显着的性能提升，这是一种不好的做法。

Answer 1

我在edgerails文档中找到了这个：http://edgeguides.rubyonrails.org/asset_pipeline.html#css-and-sass

2.3.2 CSS和Sass

使用资产管道时，必须重写资产路径，并且sass-rails为以下资产类提供-url和-path帮助程序（在Sass中用连字符连接，在Ruby中加以强调）：图像，字体，视频，音频，JavaScript和样式表。


image-url("rails.png") becomes url(/assets/rails.png)

image-path("rails.png") becomes "/assets/rails.png"


也可以使用更通用的表单，但必须同时指定资产路径和类：


asset-url("rails.png", image) becomes url(/assets/rails.png)

asset-path("rails.png", image) becomes "/assets/rails.png"

Answer 2

如果您使用的是sass或更少，则可以使用background: image-url("wax-seal-small.png");

这将在您的文件的路径前添加并附加缓存共享哈希。

否则只需将其引用到/ assets目录即可。例如。 background: url("/assets/wax-seal-small.png");

Rails图像和资产未正确加载

2 个答案: