SORU
5 HAZİRAN 2012, Salı


Raylar ile kullanarak yazı varlık boru hattı

Bazı yazı tipleri Scss dosyası gibi yapılandırılmış var:

@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');
}

Gerçek yazı tipi dosya /app/varlıklar// yazı tipleri saklanır

Benim uygulama için config.assets.paths << Rails.root.join("app", "assets", "fonts") ekledik.dosya rb

ve derleme CSS kaynağı aşağıdaki gibidir:

@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");
}

Ama yazı tipi dosyaları uygulamayı çalıştırdığımda bulunamadı. Günlükleri:

Başladı icoMoon./"/varlıklar OLSUN ttf" 2012-06-05 23:21:17 127.0.0.1 için 0100 Varlık /icoMoon görev yaptı.- 404 Bulunamadı (13ms) ttf

Neden varlık boru hattı yazı tipi dosyaları aşağı düzleştirme sadece /varlıkları içine değil mi?

Herhangi bir fikir insanlar?

Sevgi ve Saygılarımızla, Neil

Ek bilgi:

Raylar yolları ve assetprecompile varlıklar için konsol kontrol ederken şu olsun:

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

CEVAP
6 HAZİRAN 2012, ÇARŞAMBA


  1. Eğer Raylar ^ üzerinde iseniz . 3.1.0 ve &; 4, lt sadece klasörleri app/assets/fonts, lib/assets/fonts vendor/assets/fonts senin yazı yerleştirebilirsiniz.

    Eğer Raylar üzerinde ise 4 , tek klasör app/assets/fonts senin yazı yerleştirebilirsiniz.

    Eğer bu belirlenmiş klasörlerin dışına yerleştirmek istiyorsanız, aşağıdaki yapılandırma eklemek gerekir:

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

    Eğer Raylar üzerinde iseniz 4.2 , dosya config/initializers/assets.rb bu yapılandırma eklemek için tavsiye.

    Eğer değilse, dosyayı application.rb production.rb ekleyin.

  2. Yani: css yazı bildirin

    @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;
    }
    

    Yazı tipi tam olarak beyan url bölümü gibi adlandırılmış olduğundan emin olun. Büyük harfler ve noktalama işaretleri bir fark yaratabilir. Bu durumda yazı tipi adını icomoon olmalıdır.

  3. Kullanıyorsanız, Sass veya daha Az olan Raylar 3.1.0 (yani css dosyası .scss .less uzatma), sonra da Değiştir url(...) yazı tipini beyan font-url(...).

    Eğer değilse, o zaman css dosya uzantısı .css.erb olmalıdır ve yazı tipi beyanı url('<%= asset_path(...) %>') değiştirilmelidir.

    Eğer Raylar kullanıyorsanız ayrıca, 3.2.1 , asset_path(...) yerine font_path(...) kullanabilirsiniz. Bu yardımcı tam olarak aynı şeyi yapar ama biraz daha açık.

  4. Son olarak, font-family bölümünde sizin de belirttiğiniz gibi css yazı tipi kullanın. Büyük harfle ilan edildi beri, bu gibi kullanabilirsiniz:

    font-family: 'Icomoon';
    

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • ChannelRichard

    ChannelRicha

    7 Kasım 2008
  • Microsoft Help & Training Videos

    Microsoft He

    31 Mart 2009
  • FF Radioo

    FF Radioo

    14 ŞUBAT 2007