How to make Font Awesome compiled when using Grunt Build

In this sort tutorial, I would like to address the common issue when you are using Yeoman as your scaffolding tool to generate simple web app, which include Bootstrap, SASS and Modernizr. The issue is when you add Font Awesome package through bower to overcome the limitation of Glyphicons which is included in the Bootstrap. Font Awesome may work perfectly when they are generated into .tmp directory when you are in the development stage. However when you then build it, you might find that it is not generated into dist directory. That’s what I found disturbing.

Here is a Naive solution to make it works perfectly like in the development stage. This way will need you to edit three files: _variable.scss file of Font Awesome scss, main.scss in the app directory and the Gruntfile.js. Without further ado,
Continue reading