SASS SyntaxError when including web font

Question

When I try to use rake assets:precompile RAILS_ENV=production it throws this error:

Sass::SyntaxError: Invalid CSS after "...awesome-webfont": expected ")", was ".woff);"

This is my style.css file:

@font-face {
    font-family:FontAwesome;
    src:font-image-url(fontawesome-webfont.woff);
}

If I comment the line src:font-image-url(fontawesome-webfont.woff); this error appears

Sass::SyntaxError: Invalid CSS after "...:image-url(ban2": expected ")", was ".jpg);"

I am using gem "font-awesome-rails" with rails 4.2.4 .

Answer 1

Firstly, you'll need to wrap your URL in quotation marks.

Secondly, SASS does not have a URL helper font-image-url. You're maybe looking for font-url, which does the following:

Generates a path to an asset found relative to the project's font directory.

Applying the above, you should have something like:

@font-face {
    font-family: "FontAwesome";
    src: font-url("fontawesome-webfont.woff");
}

The second error seems to come from not wrapping a URL value in quotation marks a well.