自定义字体在heroku中不起作用

时间:2014-02-11 02:25:41

标签: css ruby-on-rails css3 heroku ruby-on-rails-4

使用Rails 4

我已经阅读了很多关于如何让自定义字体在heroku中运行的线程。它们在开发模式下本地工作,但是当它们被推送到heroku时它们不会出现。

我的@ font-face位于主样式表

@font-face {
    font-family: 'caviar_dreamsregular';
    src: font-url('caviardreams-webfont.eot');
    src: font-url('caviardreams-webfont.eot?#iefix') format('embedded-opentype'),
         font-url('caviardreams-webfont.woff') format('woff'),
         font-url('caviardreams-webfont.ttf') format('truetype'),
         font-url('caviardreams-webfont.svg#caviar_dreamsregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

application.rb中

config.assets.paths << "#{Rails.root}/app/assets/fonts"

我预编译资产

rake assets:precompile

Heroku日志中没有错误。

无法弄清楚这一点,是否有人有任何建议?

更新:

在我的手机上访问该网站并且字体正常工作...在计算机上清除缓存,仍然无法在计算机上运行。

1 个答案:

答案 0 :(得分:7)

这可能是几个问题;最值得注意的是,我建议你不要使用动态资产路径:


<强>指纹

Rails在预编译资产时使用asset fingerprinting

这样做的原因是允许将每个资产单独分配给系统,从而提供更健壮的结构(或某种东西)。基本上,它会在资产文件名的末尾添加MD5哈希:

global-908e25f4bf641868d8683022a5b62f54.css

<强>路径

由于动态指纹识别使所有预编译资产具有不同的名称,因此您需要使用Rails的动态路径助手:

#app/assets/stylesheets/application.css.scss
@font-face {
    font-family: 'caviar_dreamsregular';
    src: asset-url('caviardreams-webfont.eot');
    src: asset-url('caviardreams-webfont.eot?#iefix') format('embedded-opentype'),
         asset-url('caviardreams-webfont.woff') format('woff'),
         asset-url('caviardreams-webfont.ttf') format('truetype'),
         asset-url('caviardreams-webfont.svg#caviar_dreamsregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

您需要使用动态样式表引擎(例如SASS)来处理动态路径