CODEWITHSUNDEEP
ruby-on-railsruby-on-rails-4
user2384124
user2384124

Reputation:

asset-path Rails 4 - Will not compile to /assets

I am working with a font file, of which looks like this:

@font-face {
  font-family: 'FontAwesome';
  src: url(asset-path('fontawesome-webfont.eot', font));
  src: url(asset-path('fontawesome-webfont.eot', font)) format('embedded-opentype'),
    url(asset-path('fontawesome-webfont.woff', font)) format('woff'),
    url(asset-path('fontawesome-webfont.ttf', font)) format('truetype'),
    url(asset-path('fontawesome-webfont.svg', font)) format('svg');
//  src: url('#{$FontAwesomePath}/FontAwesome.otf') format('opentype'); // used when developing fonts
  font-weight: normal;
  font-style: normal;
}

I was under the impression that this syntax: url(asset-url('...'), font)); from a SCSS file should render /assets/font.oet, for instance, in the CSS file that is gets compressed to.

That is not what is happening. It doesn't change at all. I still see url(asset-url('...'), font)); in the CSS file.

My Setup:

I have all my SCSS files housed under app/assets/stylesheets. I pull all the SCSS files into Application.css.scss via @import tags. (Could this be a reason why asset-path will not parse?).

*I need something that will render the asset pipeline MD5 fingerprint when I run RAILS_ENV=production bundle exec rake assets:precompile, so if asset-url will NOT render the fingerprint, can you please point me to a helper that will *

Appreciate the help.

Upvotes: 1

Views: 1353

Answers (2)

Hannes
Hannes

Reputation: 2501

Using font-url instead of font-path like this works like a charm for me: 

@font-face {
  font-family: 'FontAwesome';
  src: font-url('fontawesome-webfont.eot');
  src: font-url('fontawesome-webfont.eot') format('embedded-opentype'), font-url('fontawesome-webfont.woff') format('woff'), font-url('fontawesome-webfont.ttf') format('truetype'), font-url('fontawesome-webfont.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

Upvotes: 0

Chawarong Songserm PMP
Chawarong Songserm PMP

Reputation: 1784

How about using font-path instead of asset-path and drop ", font" at the end. 

@font-face {
  font-family: 'FontAwesome';
  src: url(font-path('fontawesome-webfont.eot');
  src: url(font-path('fontawesome-webfont.eot')) format('embedded-opentype'),
    url(font-path('fontawesome-webfont.woff')) format('woff'),
    url(font-path('fontawesome-webfont.ttf')) format('truetype'),
    url(font-path('fontawesome-webfont.svg')) format('svg');
//  src: url('#{$FontAwesomePath}/FontAwesome.otf') format('opentype'); // used when developing fonts
  font-weight: normal;
  font-style: normal;
}

It will be translated into e.g. 

src:url("/assets/fontawesome-webfont-0a491f75efc766a9fe9daaa5f407aec1.eot");
...

For more info., somebody has asked similar question here.

Upvotes: 0

Related Questions