Question

我们是否应该使用除image-url之外的其他内容以及Rails 4中的其他内容？它们返回的值不同，似乎没有意义。如果我logo.png中有/app/assets/images/logo.png并且我执行了以下操作，那就是我得到的：

image-url("logo.png") -> url("/images/logo.png") #obviously doesn't work
image-path("logo.png") -> "/images/logo.png"
asset-url("logo.png") -> url("/logo.png")

当然，这些都不起作用，因为它们至少需要/assets。

更新：实际上，我刚注意到，如何在Rails 4中访问图像？我在/app/assets/images/logo.png处有一张图片。但是，如果我转到以下任何网址，我仍然看不到我的图片：

http://localhost:3000/assets/logo.png
http://localhost:3000/assets/images/logo.png
http://localhost:3000/logo.png
http://localhost:3000/images/logo.png

更新2 ：我提出logo.png的唯一方法是将其移至/app/assets/stylesheets目录然后拉起：

http://localhost:3000/assets/logo.png

Answer 1

我自己就是这个问题。 3点，希望有所帮助：

如果您将图像放在app/assets/images目录中，那么您应该可以直接调用图像，路径中没有前缀。即。 image_url('logo.png')
根据您使用的位置，资产取决于方法。如果您将其用作background-image:属性，那么您的代码行应为background-image: image-url('logo.png')。这适用于less和sass样式表。如果您在视图中内联使用它，那么您将需要使用rails中的内置image_tag帮助程序来输出图像。再一次，没有前缀<%= image_tag 'logo.png' %>
最后，如果您要预编译资产，请运行rake assets:precompile生成资产，或rake assets:precompile RAILS_ENV=production生产资产，否则，生产环境在加载页面时不会有指纹资产。

对于第3点中的那些命令，如果您正在运行bundler，则需要使用bundle exec作为前缀。

Answer 2

您的第一个配方image_url('logo.png')是正确的。如果找到图像，它将生成路径/assets/logo.png（加上生产中的哈希）。但是，如果Rails找不到您命名的图像，它将回退到/images/logo.png。

接下来的问题是：为什么Rails没有找到你的形象？如果您将它放在app / assets / images / logo.png中，那么您应该可以通过转到http://localhost:3000/assets/logo.png来访问它。

如果可行，但您的CSS未更新，则可能需要清除缓存。从项目目录中删除tmp/cache/assets并重新启动服务器（webrick等）。

如果失败，您也可以尝试使用background-image: url(logo.png);这将导致您的CSS查找具有相同相对路径的文件（在本例中为/ assets）。

Answer 3

我刚刚发现，通过使用asset_url帮助程序，您可以解决该问题。

asset_url("backgrounds/pattern.png", image)

Answer 4

我遇到了类似的问题，尝试使用内联css添加背景图片。由于资产同步的工作方式，无需指定images文件夹。

这对我有用：

background-image: url('/assets/image.jpg');

Answer 5

Rails 4.0.0将使用与您的css文件相同的目录结构中的image-url查看定义的图像。

例如，如果assets/stylesheets/main.css.scss中的css，image-url('logo.png')变为url(/assets/logo.png)。

如果您将css文件移至assets/stylesheets/cpanel/main.css.scss，image-url('logo.png')将变为/assets/cpanel/logo.png。

如果要直接在assets / images目录下使用image，可以使用asset-url('logo.png')

Answer 6

用于样式表： URL（asset_path（ 'image.jpg的'））

Answer 7

如果有人来寻找如何从 rails 控制台生成相对路径

ActionView::Helpers::AssetTagHelper
image_path('my_image.png')
=> "/images/my_image.png"

或控制器

include ActionView::Helpers::AssetTagHelper
image_path('my_image.png')
=> "/images/my_image.png"

Rails 4 image-path，image-url和asset-url不再适用于SCSS文件

7 个答案: