Rails 3.1和图像资产

时间:2011-06-02 10:20:44

标签: ruby-on-rails ruby-on-rails-3

我已将我的管理主题的所有图片放在名为admin的文件夹中的assets文件夹中。然后我像正常那样链接到它。

# Ruby    
image_tag "admin/file.jpg" .....
#CSS
.logo{ background:url('/assets/images/admin/logo.png');

FYI。仅仅是为了测试我还没有使用asset_path标签,因为我还没有编译我的资产。

到目前为止,我还好,直到我决定更新图片。我更换了一些颜色,但在重新加载新样式的图像时没有显示。如果我直接在浏览器中查看图像,它仍然显示旧图像。更进一步,我摧毁了管理员图像文件夹。但它没有破坏所有图像仍在显示。是的,我已经清除了我的缓存并尝试了多个浏览器。

是否存在某种图像缓存?这只是使用pow来为页面提供服务的本地开发。

即使破坏了整个图像文件夹,图像仍在提供。

我错过了什么吗?

7 个答案:

答案 0 :(得分:226)

在3.1中,您只需摆脱路径中的“图像”部分。因此,位于/assets/images/example.png的图片实际上可以在此网址的获取请求中访问 - /assets/example.png

由于assets/images文件夹与新的3.1应用程序一起生成,因此这是他们可能希望您遵循的惯例。我认为这是image_tag寻找的地方,但我还没有测试过。

另外,在RailsConf主题演讲中,我记得D2h说public folder不应该有更多内容,主要是错误页面和图标。

答案 1 :(得分:98)

您需要将css文件的扩展名从.css.scss更改为.css.scss.erb并执行:

background-image:url(<%=asset_path "admin/logo.png"%>);

您可能需要执行“硬刷新”才能看到更改。 OSX浏览器上的CMD + SHIFT + R.

在制作中,请确保

rm -rf public/assets    
bundle exec rake assets:precompile RAILS_ENV=production

在部署时发生。

答案 2 :(得分:22)

为了它的价值,当我这样做时,我发现在css文件的路径中不应该包含任何文件夹。例如,如果我有app/assets/images/example.png,我把它放在我的css文件中......

div.example { background: url('example.png'); }

......然后它以某种方式神奇地起作用。我通过运行rake assets:precompile任务来解决这个问题,该任务只是从所有加载路径中取出所有内容并将其转储到垃圾抽屉文件夹中:public/assets。具有讽刺意味的是,IMO ......

在任何情况下,这意味着您不需要放置任何文件夹路径,资产文件夹中的所有内容都将最终存放在一个巨大的目录中。该系统如何解决文件名冲突尚不清楚,您可能需要小心。

令人沮丧的是,没有更好的文档可以用于这一重大改变。

答案 3 :(得分:16)

在rails 4中,您现在可以使用css和sass helper image-url:

div.logo {background-image: image-url("logo.png");}

如果您的背景图片没有显示,请考虑查看您在样式表中引用它们的方式。

答案 4 :(得分:10)

在CSS或IMG标签中引用图像时,请使用image-name.jpg

虽然图像确实位于./assets/images/image-name.jpg

答案 5 :(得分:2)

http://railscasts.com/episodes/279-understanding-the-asset-pipeline

此railscast(资产管道上的Rails Tutorial视频)也有助于解释资产管道中的路径。我发现它很有用,实际上看了几次。

我选择的解决方案是@Lee McAlilly,但是这个railscast帮助我理解了它的工作原理。希望它有所帮助!

答案 6 :(得分:0)

rails中的资产管道为这个问题提供了一种方法。

您只需将image_path('image filename')添加到您的css或scss文件中,rails就可以处理所有事情。例如:

.logo{ background:url(image_path('admin/logo.png'));

(请注意,它的工作方式与.erb视图相同,并且您不在路径中使用“/ assets”或“/ assets / images”)

Rails还提供其他帮助方法,这里有另一个答案:How do I use reference images in Sass when using Rails 3.1?