Question

在CSS文件中，您可以使用以下命令获取图像资源的正确名称（带指纹）：

background-image: url(image-url("rails.png"))

但是你如何从JavaScript文件中做同样的事情呢？

Answer 1

我看到你正在使用sass helper方法。

在标准（非Sass）CSS中，您可以执行以下操作：

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

CSS文件需要将erb添加到扩展名中：

file_name.css.erb

对于javascript，适用相同的规则：

file_name.js.erb

并在文件中：

var image_path = '<%= asset_path 'image.png' %>'

Rails asset pipeline guide是有关如何使用这些功能的绝佳信息来源。

Answer 2

在Rails 4中，我建议你不要使用js.erb视图，而是坚持使用资源管道，并使用变量或使用gon或其他一些技术将变量传递给它：{{3} }

使用gon：

应用程序/视图/布局/ application.html.erb：

<head>
  <meta charset="utf-8"/>
  <%= include_gon %>

应用程序/控制器/ application_controller.rb：

before_filter { gon.path = asset_path 'image.png' }

应用程序/资产/ Javascript角/ file.js.coffee：

alert gon.path

此方法更快，因为文件在启动时仅预编译一次，由服务器而不是通过Rails提供服务，并且与其他Js在相同的HTTP请求上。