2

I used Yeoman to scaffold my project and Bower to install Font Awesome. I added

$fa-font-path: "../bower_components/font-awesome/fonts/";
@import "../bower_components/font-awesome/scss/font-awesome";

to app/styles/style.css

The fonts showed during development but not in the deployed stage where I used grunt dist to pack my files for deployment. I could see the font-awesome URLs in my dist/styles/59268e94.main.css were pointing to /bower_components/font-awesome/fonts/ whereas Bootsrap's glyphicons URLs were changed to a new location e.g. @font-face{font-family:'Glyphicons Halflings';src:url(../styles/fonts/2ad0632b.glyphicons-halflings-regular.eot). I think this could be the problem.

How can I get my web application to work with Font Awesome? Thanks.

Update #1 (26/3)

While waiting for a better answer and as to why Font Awesome SCSS fonts' URL were not changed like those in Bootstraps SCSS, I decided to remove "renaming the fonts files" task from Gruntfile.js as suggested by @bpaul in https://stackoverflow.com/a/21396651/185514

Community
  • 1
  • 1
thlim
  • 2,908
  • 3
  • 34
  • 57
  • eventually this helps? http://stackoverflow.com/questions/19775497/yeoman-generator-font-awesome – chris Mar 25 '14 at 14:46
  • not good. i added this to index.html and built.it complained that "Running "cssmin:dist/styles/vendor/fontawesome.css" (cssmin) task >> Destination not written because minified CSS was empty." – thlim Mar 25 '14 at 15:07
  • I can see why not renaming the fonts files helps. I don't why Bootstrap fonts worked but not Font Awesome. Is there a builtin process to Bootstrap components? – thlim Mar 25 '14 at 15:13

0 Answers0