我有一个使用Font-Awesome的Rails应用程序。图标在开发环境中显示,但不在生产环境中显示。

我已经检查了我的Nginx / Passenger日志,这些日志显示以下内容:

[21/Nov/2017:17:13:25 +0000] "GET /assets/back/font-awesome/fontawesome-webfont.ttf HTTP/1.1" 404 1564 "https://example.com/assets/application_back-b78b545bb6d96e3f98206780079663e7d84d11a41143a57b3ab7b110feac9944.css

我已经检查了public/assets/back/font-awesome/目录,所有字体文件都显示为fontawesome-webfont-aa58f33f239a0fb02f5c7a6c45c043d7a9ac9a093335806694ecd6d4edc0d6a8.ttf,这就是为什么它找不到文件但我不知道为什么这样做的原因

最佳答案

Rails资产管道在文件名的末尾添加了一个字符串,以便资产在修改时可以从缓存中过期。因此,您需要使用内置的URL帮助器中的Rails来确保引用正确的文件名。

在您引用了Font Awesome字体的任何ERB中,请尝试使用资产路径帮助器:

@font-face {
  font-family: 'fontawesome-webfont';
  src: url('<%= asset_path("fontawesome-webfont.eot") %>');
  src: url('<%= asset_path("fontawesome-webfont.eot#iefix") %>')
  format('embedded-opentype'),
  url('<%= asset_path("fontawesome-webfont.woff") %>') format('woff'),
  url('<%= asset_path("fontawesome-webfont.ttf") %>') format('truetype');
}


在您的SASS文件中,您可以使用asset-url帮助器:

@font-face {
  font-family: 'fontawesome-webfont';
  src: asset-url("fontawesome-webfont.eot");
  src: asset-url("fontawesome-webfont.eot#iefix")
  format('embedded-opentype'),
  asset-url("fontawesome-webfont.woff") format('woff'),
  asset-url("fontawesome-webfont.ttf") format('truetype');
}


如果您只是尝试从一种布局中引用字体超棒的CSS文件,请使用样式表助手:

stylesheet_link_tag "FILENAME-OF-YOUR-FA-STYLESHEET.css"


这是有关Rails资产管道和可用的所有其他帮助程序的更多信息:Rails Asset Pipline Docs

10-05 20:38
查看更多