将@font-face 与 Ruby on Rails 一起使用？答案

【问题标题】：Using @font-face with Ruby on Rails?将@font-face 与 Ruby on Rails 一起使用？
【发布时间】：2014-01-22 10:56:41
【问题描述】：

我正在尝试在 Rails 中包含我的自定义字体。

我的文件字体在app/assets/fonts/。

我编辑了 CSS：

# in app/assets/stylesheets/application.css

@font-face {
  font-family: 'fontello';
  src: url('fonts/fontello.eot');
  src: url('fonts/fontello.eot#iefix')format('embedded-opentype'),
       url('fonts/fontello.woff') format('woff'),
       url('fonts/fontello.ttf') format('truetype');
}

我也尝试更改路径url('assets/fonts/fontello.eot');url('fontello.eot');。

我编辑了配置：

# in config/application.rb

require File.expand_path('../boot', __FILE__)
require 'rails/all'

Bundler.require(:default, Rails.env)

module Gui
  class Application < Rails::Application
    config.assets.paths << Rails.root.join('app', 'assets', 'fonts')
  end
end

但它不起作用。

我使用的是 Rails 4.0.2。

【问题讨论】：

看到这个stackoverflow.com/questions/7973271/…

标签： css ruby-on-rails ruby fonts

【解决方案1】：

您需要使用asset_path 在css 文件中使用资产（将erb 扩展名添加到您的application.css 文件，然后asset_path 在您的CSS 规则中可用）

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

【讨论】：

我将文件名 app/assets/stylesheets/application.css 修改为 app/assets/stylesheets/application.css.erb 并替换了你的行...但不起作用:(
尝试添加 scss 扩展来添加这样的 sass 功能：application.css.scss.erb

【解决方案2】：

我鼓励您从类似的帖子中查看此答案 --

首先将您的字体放入 app/assets/fonts。之后，您可以通过 font-url('font.eot') 帮助器将字体包含在 sass / scss 文件中。

否则，asset_path 应该仍然可以在那里找到字体决定使用它。

Integrating @font-face files into rails asset pipeline

感谢：

https://stackoverflow.com/users/120434/andrew-nesbitt

和

https://stackoverflow.com/users/753177/john

【讨论】：