References to font (font-awesome) resources are not updated in yeoman/angular grunt build
angularjs, bootstrap-sass, bower, font-awesome, gruntjs
Solution
Finally, I figured it out :)
I pinned down cssmin to be the bad guy in this game: It was responsible for writing the .tmp paths into the final css file. To solve this, I added the `noRebase: true,` option to the cssmin task in Gruntfile.js .
To get along with the font references, I also used the copy task to copy the fonts into my dist folder and had to use `$icon-font-path: "../fonts/"` to have it finally in the right format.
Maybe this will help someone stuck in a similar situation :-)
Problem
I'm aware of the SO threads about this (I've linked them below), but unfortunately I couldn't solve this with them, so please allow me this question :-) I've bootstrapped an AngularJS project with Yeoman and thus rely on a grunt.js build utilizing bower.js and SCSS. I want to use font-awesome and the glyphicons-halflings-regular from bootstrap-sass-official. When running "grunt serve" everything is fine, but when I want to create a fileset for distribution, the references to the font files are not updated as they should. The main.scss contains ``` $icon-font-path: "../bower_components/bootstrap-sass-official/vendor/assets/fonts/bootstrap/"; @import 'bootstrap-sass-official/vendor/assets/stylesheets/bootstrap'; $fa-font-path: "../bower_components/font-awesome/fonts/"; @import "font-awesome/scss/font-awesome"; ``` but the outcome in the dist/styles/123456.main.css are references like ``` @font-face{font-family:FontAwesome;src:url(/Users/markus/src/angular_app/.tmp/bower_components/font-awesome/fonts/fontawesome-webfont.eot?v=4.1.0); ``` So, to me it looks like the path is updated (to the tmp path) but not with the right value for "dist". I tried to fiddle with the copy and rev tasks in the gruntfile but haven't found the right trigger to pull, yet :( Threads and other sources I used to find a solution for this: - Fontawesome is not working when project is built with grunt - Assets missing in Angular application built using grunt - Font awesome URL not coded in main.css for grunt dist - http://likesalmon.net/use-font-awesome-on-yeoman-angularjs-projects/ - https://github.com/yeoman/generator-angular/issues/350 Any hints how I could takle this?