我的Scss文件中配置了一些字体,如下所示:

@font-face {
  font-family: 'Icomoon';
  src: asset-url('icoMoon.eot?#iefix', font) format('embedded-opentype'),
       asset-url('icoMoon.woff', font) format('woff'),
       asset-url('icoMoon.ttf', font)  format('truetype'),
       asset-url('icoMoon.svg#Icomoon', font) format('svg');
}

实际的字体文件存储在/app/assets/fonts中/

我在申请表上加了config.assets.paths << Rails.root.join("app", "assets", "fonts")个.rb文件

编译CSS源代码如下:

@font-face {
  font-family: 'Icomoon';
  src: url(/assets/icoMoon.eot?#iefix) format("embedded-opentype"), url(/assets/icoMoon.woff) format("woff"), url(/assets/icoMoon.ttf) format("truetype"), url(/assets/icoMoon.svg#Icomoon) format("svg");
}

但当我运行应用程序时,找不到字体文件.日志(log):

2012-06-05 23:21:17+0100开始获取127.0.0.1的"/assets/icoMoon.ttf"

为什么assets资源 管道不能将字体文件平铺为/assets?

有什么 idea 吗?

亲切的问候,

Extra info:

在判断rails控制台中的assets资源 路径和assetprecompile时,我得到以下信息:

1.9.2p320 :001 > y Rails.application.config.assets.precompile
---
- !ruby/object:Proc {}
- !ruby/regexp /(?:\/|\\|\A)application\.(css|js)$/
- .svg
- .eot
- .woff
- .ttf
=> nil



1.9.2p320 :002 > y Rails.application.config.assets.paths
---
- /Users/neiltonge/code/neiltonge/app/assets/fonts
- /Users/neiltonge/code/neiltonge/app/assets/images
- /Users/neiltonge/code/neiltonge/app/assets/javascripts
- /Users/neiltonge/code/neiltonge/app/assets/stylesheets
- /Users/neiltonge/code/neiltonge/vendor/assets/images
- /Users/neiltonge/code/neiltonge/vendor/assets/javascripts
- /Users/neiltonge/code/neiltonge/vendor/assets/stylesheets
- /Users/neiltonge/.rvm/gems/ruby-1.9.2-p320@neiltonge/gems/jquery-rails-2.0.0/vendor/assets/javascripts
- /Users/neiltonge/.rvm/gems/ruby-1.9.2-p320@neiltonge/gems/coffee-rails-3.2.1/lib/assets/javascripts
- /Users/neiltonge/.rvm/gems/ruby-1.9.2-p320@neiltonge/gems/bourbon-1.3.0/app/assets/stylesheets
- !ruby/object:Pathname
  path: /Users/neiltonge/code/neiltonge/app/assets/fonts
 => nil

推荐答案

  1. 若Rails版本介于> 3.1.0< 4之间,请将字体放在以下任一文件夹中:

    • app/assets/fonts
    • lib/assets/fonts
    • vendor/assets/fonts


    在Rails文件夹中放置> 4个字体.

    Note:要将字体放置在这些指定文件夹之外,请使用以下配置:

    config.assets.precompile << /\.(?:svg|eot|woff|ttf)\z/

    对于Rails版本> 4.2,将此配置添加到config/initializers/assets.rb是非常困难的.

    但是,也可以将其添加到config/application.rbconfig/production.rb

  2. 在CSS文件中声明字体:

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

    确保您的字体名称与声明的URL部分完全相同.大写字母和标点符号很重要.在这种情况下,字体的名称应为icomoon.

  3. 如果在Rails > 3.1.0中使用Sass或更少(CSS文件的扩展名为.scss.less),则将字体声明中的url(...)更改为font-url(...).

    否则,CSS文件的扩展名应该是.css.erb,字体声明应该是url('<%= asset_path(...) %>').

    如果您使用的是Rails > 3.2.1,那么可以使用font_path(...)而不是asset_path(...).这个助手做了完全相同的事情,但更清楚.

  4. 最后,在CSS中使用字体,就像在font-family部分中声明的那样.如果声明为大写,可以这样使用:

    font-family: 'Icomoon';
    

Ruby-on-rails相关问答推荐

如何测试自定义路由?

如何控制或定制S为模型使用的命名路由Rail()?

安装特定版本的Ruby时出现问题(OpenSSL问题)

将两个日期之间的差值转换为Ruby中的iso8601持续时间(如果需要,还可以使用Rails)

带有data-turbo的rails`link_to‘未获得turbo_stream请求格式

使用Rails和RSpec,有没有办法查看操作真正将您带到哪个页面?

如何断言 Ruby 单元测试中的错误消息?

使用带有 bootstrap-sass gem 的 Rails 4 无法让 CSS 在 Heroku 上工作

在 Rails 3.2 中更新多行

Rails 4.1 Mailer 预览和设计自定义邮箱

简单表单关联自定义标签名称

Ruby如何写入Tempfile

Rails 服务对象与 lib 类

.increment vs += 1

在 Rails 中创建随机 DateTime 的最佳方法

如何在rails中异步加载部分页面

未捕获的类型错误:未定义不是函数- 初学者 Backbone.js 应用程序

如何拯救 OmniAuth::Strategies::OAuth2::CallbackError?

在rails中带有内部文本或html的link_to image_tag

如何从 rails 控制器操作发出 404 响应?