在部署我的 Ruby on Rails 应用程序时丢失图标

Posted 2023-03-13

【中文标题】在部署我的 Ruby on Rails 应用程序时丢失图标

【英文标题】：Lose icon on deployment of my Ruby on Rails application

【发布时间】：2016-05-11 19:24:22

【问题描述】：

我有一个使用列标题进行排序的应用程序。当用户单击标题时，标题旁边会出现一个图标以显示排序方向。

它使用 CSS 来选择图标并呈现它：

.pretty th .asc 
    background-image: url(up-arrow.png);


.pretty th .desc 
    background-image: url(down-arrow.png);

这适用于我的开发版本，即使我希望图标的路径是“/images/up-arrow.png”而不是“up-arrow.png”。但是，当我将应用程序部署到我的服务器时，无论我是否以 /images 为前缀，图标都不再出现。有什么想法吗？

【问题讨论】：

VB6 那些日子

请不要说“谢谢”。虽然看起来像是一种礼貌，但 Stack Overflow 是一本参考书，而不是一个讨论板。想想一本关于编程问题和答案的食谱或百科全书；你会在这些词中看到“嗨”、“谢谢”和类似的词吗？礼貌很好，但问候、告别和签名被认为是无用的，我们更喜欢简洁并注重细节。

【参考方案1】：

因为您要部署到非开发环境，Rails 将期望"precompile" 您的资产。这意味着 filenames will be fingerprinted （它们将附加大量数字）。

由于资产指纹意味着production / staging 中的文件名不同，因此您必须在 CSS 中使用 asset-helpers 之一：

.pretty th .asc 
    background-image: image-url("up-arrow.png");


.pretty th .desc 
    background-image: image-url("down-arrow.png");

您需要查看“How to reference images in CSS within Rails 4”了解详情。

您可能遇到的一个问题是您可能必须切换 CSS 以使用 SCSS / SASS proprocessor。这将使您能够访问image-url 助手。

【参考方案2】：

由于资产管道处理图像的方式，您需要以不同的方式引用图像名称：

.pretty th .asc 
  background-image: url("/assets/up-arrow.png");


.pretty th .desc 
  background-image: url("/assets/down-arrow.png");

【讨论】：

这是不对的——你必须使用image_url

啊，没有意识到 Rails 默认包含sass-rails。也是image-url，顺便说一句