Rails资产路径中的CSS未由ERB在开发中处理


CSS in Rails Asset Path not processed by ERB in development

我在/app/assets/stylesheets/styles.css.erb中有一个带有以下内容的Rails应用程序：

1
2
3
4
5
6
7
8
...
#nestedbg {
    background-position: left top;
    background-image: url(<%= asset_path 'siteheader2.png' %>);
    background-repeat: repeat-x;
    background-attachment: fixed;
}
...

当我运行rake assets:precompile然后运行rails s -e production时，一切都按预期工作。但是，当我删除预编译的资产并在开发中运行rails s时，CSS文件会出现如上图所示，而不是被正确替换。

我试着把config.assets.compile = true放在/config/environments/development.rb里，但没有用。

有什么想法吗？谢谢。

老实说，我不能解释为什么在你的案例中解释不正确，但我有一个更好的解决方法：跳过erb解释。

您可以这样做：

1
2
/* styles.css.scss */
background-image:url(image_path("siteheader2.png"));

如果你没有机会的话，我也建议你看看Sass：它集成在Rails资产管道中，可以让你做一些很酷的事情，比如变量声明、嵌套、混合等等。

相关讨论

我发现我的CSS文件不会被erb处理，除非添加了scss处理。

我把我的screen.css.erb改为screen.css.scss.erb，现在<%= asset_path 'file.png' %>被正确地改为/assets/file.png。

我在轨道3.1.3上。

相关讨论

我使用的是Rails 3.1.1，当我将应用程序切换到使用Rails 3.1.3时，问题就消失了。我切换到3.1.1，看看问题是否回来了。

我猜这是其中一个gem的问题，3.1.3的更新带来了其他gem的更新。

CSS与ERP

资产管道自动评估erb。这意味着，如果将erb扩展添加到CSS资产(例如application.css.erb)，那么可以在CSS规则中使用asset_path之类的帮助程序：

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

这将写入正在引用的特定资产的路径。在本例中，在资产加载路径之一(如app/assets/images/image.png)中使用图像是有意义的，它将在此处引用。如果此图像已作为指纹文件在public/assets中可用，则会引用该路径。

如果您想使用数据URI(一种直接将图像数据嵌入到CSS文件中的方法)，您可以使用资产数据 URI助手。

CSS和SASS：

在使用资产管道时，必须重新编写资产路径，并且sass rails为以下资产类提供-url和-path帮助程序(在sass中断字，在ruby中下划线)：图像、字体、视频、音频、javascript和样式表。

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

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

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

引用者：Rails Guide资源管线

标题：2.2.1和2.2.2。

SamOliver的建议对我起了作用，只是重命名扩展名并没有更新文件上的时间戳。

奇怪的是，我发现把asset_path改成asset_data_uri，然后再改回asset_path对我来说很有用。一直在使用Rails 3.1.3。

奇怪。

相关讨论