如何在rails 5中设置资产管道以使用自定义字体? [英] How to setup assets pipeline in rails 5 to use a custom font?

查看:244
本文介绍了如何在rails 5中设置资产管道以使用自定义字体?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我必须使用自定义字体 Jameel Noori Nastaleeq 在轨道5应用程序。我以前从来没有在rails的资产管道上工作过。以下是我所采取的一些步骤:


  1. 创建字体 code> app / assets ,然后将提取的 ttf 字体文件放入其中
  2. add config.assets.paths<< Rails.root.join(app,assets,fonts)在 config / application.rb中

  3. app / assets / stylesheets / couplets.scss 中添加以下内容:

    @ font-face {

    font-family:'Jameel Noori Nastaleeq';

    src:asset-url('JameelNooriNastaleeq.ttf')format(truetype); >
    }

    虽然没有错误/警告,但上述步骤不起作用。我错过了什么。

  4. / questions / 32334157 / custom-font-not-working-in-rails-asset-pipeline>自定义字体在Rails Asset Pipeline中不起作用 将@ font-face文件集成到Rails资产管道
    中,但是他们的答案没有帮助。



    完整的代码在我的 github回购

    解决方案

    我使用脚手架生成了资源。在 app / assets / stylesheets / scaffold.scss 中添加所需的 font-family 修复了这个问题。我已经更新了 github repo


    I have to use a custom font Jameel Noori Nastaleeq in a rails 5 app. I have never worked with assets pipeline in rails before. Here are some of the steps I have taken:

    1. create fonts folder in app/assets, and place the extracted ttf font file in it
    2. add config.assets.paths << Rails.root.join("app", "assets", "fonts") in config/application.rb
    3. add the following in app/assets/stylesheets/couplets.scss:

      @font-face {
      font-family: 'Jameel Noori Nastaleeq';
      src:asset-url('JameelNooriNastaleeq.ttf') format("truetype");
      }
      Although there is no error/warnings, the above steps have no effect. Am I missing something.

    I have already seen similar questions Custom Font not working in Rails Asset Pipeline Integrating @font-face files into rails asset pipeline but their answers were not helpful.

    Complete code in my github repo

    解决方案

    I had generated the resources using scaffold. Adding desired font-family in app/assets/stylesheets/scaffold.scss fixed the problem. I have updated the github repo.

    这篇关于如何在rails 5中设置资产管道以使用自定义字体?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆