Font files don't get copied from gem

[olavk]

I am using font-awesome-sass with Compass, without Rails. The .css gets copied into css/font-awesome/font-awesome.css but there are no font-awesome fonts in my fonts directory.

I've done:
gem install compass
gem install bootstrap-sass
gem install font-awesome-sass

config.rb:

require 'bootstrap-sass'
require 'compass/import-once/activate'
require 'font-awesome-sass'
http_path = "/"
css_dir = "css"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "js"
fonts_dir = "fonts"
relative_assets = true

styles.scss:

@import "bootstrap-compass";
@import "bootstrap-variables";
@import "bootstrap";
@import "font-awesome-compass";
@import "font-awesome";

Fonts directory only has glyphicons from bootstrap-sass, and it works, so i know the paths are correct. Only font-awesome doesn't get fonts copied

[joelvh]

@olavk I've got the same issue, but using Rails. It's actually the asset pipeline that does have the fonts, but the path is wrong. It should be /assets/fontawesome-webfont.woff instead of /fonts/fontawesome-webfont.woff.

[pdenya]

+1

For anyone experiencing this issue, a temporary fix is to run this before the font-awesome css:

@font-face {
  font-family: 'FontAwesome';
  src: url("../assets/font-awesome/fontawesome-webfont.eot");
  src: url("../assets/font-awesome/fontawesome-webfont.eot?#iefix") format("embedded-opentype"), url("../assets/font-awesome/fontawesome-webfont.woff") format("woff"), url("../assets/font-awesome/fontawesome-webfont.ttf") format("truetype"), url("../assets/font-awesome/fontawesome-webfont.svg#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

[pdai1y]

Same issue with Compass compiling Jekyll assets. Fix suggested by @pdenya doesn't work as the font files are never moved to the /fonts directory in my workspace.

[fxruizx]

Same issue with just straight Compass, but not using any bootstrap. Also tried @pdenya solution but did not work. Downloading the zip and copying the font directory into my root folder seemed to work though.

[kumiau]

Same here. Running a compass only project. My processed css is generating the url with the function "font-path":

@font-face {
  font-family: 'FontAwesome';
  src: url(font-path("font-awesome/fontawesome-webfont.eot"));
  src: url(font-path("font-awesome/fontawesome-webfont.eot?#iefix")) format("embedded-opentype"), url(font-path("font-awesome/fontawesome-webfont.woff2")) format("woff2"), url(font-path("font-awesome/fontawesome-webfont.woff")) format("woff"), url(font-path("font-awesome/fontawesome-webfont.ttf")) format("truetype"), url(font-path("font-awesome/fontawesome-webfont.svg#fontawesomeregular")) format("svg");
  font-weight: normal;
  font-style: normal;
}

[striky1]

still same here

[bobmshannon]

I've run into the same issue as well, just using compass. The font files are not being copied into the fonts directory.

[alexkerr]

Same issue here - font files not copied into font directory. Using Compass without Rails.

[njt1982]

1 year old issue - is there any known fix?

[doomspork]

💥 @andreykul that did the trick for me, thanks!

[andreabedini]

I had @import "font-awesome-sprockets"; but the solution was to make sure that line was before anything else. I understand the same would happen with @import "font-awesome-compass";

My guess is that a solution to @olavk original problem would be doing

@import "font-awesome-compass";
@import "font-awesome";
@import "bootstrap-compass";
@import "bootstrap-variables";
@import "bootstrap";

[andreykul]

@andreabedini the order of those two matters

@import "font-awesome-compass"; 
@import "font-awesome";

The rest has nothing to do with font-awesome so it would not matter.

[andreabedini]

@andreykul you are right. I don't know what led me to think otherwise 🙈

[michael-brade]

@andreykul well, no, the original issue (which also affects me) is using font-awesome-sass and compass without rails. Doing

compass install font-awesome

copies no fonts, nothing. In that case @import "font-awesome-sprockets"; does not help and is not needed either. On the contrary, it produces wrong CSS output. But if I manually copy the fonts, i.e.,

cp -a /var/lib/gems/2.2.0/gems/font-awesome-sass-4.5.0/assets/fonts/font-awesome build/fonts

and then follow up with compass compile, everything is fine. But this extra cp is annoying because everytime I do a clean, I have to copy again. compass install bootstrap does copy its fonts properly.

[TKlement]

Has anyone solved it yet?
None of the tipps solve actual the problem.
I have to copy all fonts into my project.

[ukazap]

Not yet. Yep, still have to copy the fonts manually.

[kWhittington]

Thx @andreykul, making sure I had the order:

@import "font-awesome-sprockets";
@import "font-awesome";

fixed it.

Versions:

font-awesome-sass (4.5.0)
sass-rails (4.0.5)
sprockets (2.12.4)

[alex94cp]

Still doesn't work for compass/non-rails users, fonts don't get copied.

[fregan]

Same as above. Using only compass and fonts are not copying over to theme folder. Also the fonts_dir is acting strangely - its appending it to the scss folder instead of a level up when using "../fonts" for the directory..

[TruePath]

Ok, this seems to work and I'm submitting the code to the github repo.

Change the file assets/stylesheets/_font-awesome-compass.scss to exactly match assets/stylesheets/_font-awesome-sprockets.scss

The question is whether it breaks anything else. Hopefully someone who knows more about this than me can answer that...or I guess they will see it when I suggest it on github.

[ghost]

@TruePath's fix works for me, after having this same problem!