generator-gulp-angular icon indicating copy to clipboard operation
generator-gulp-angular copied to clipboard

Bootstrap Glyphicons not rendering using gulp serve:dist (minified css)

Open daveteply opened this issue 9 years ago • 2 comments

When launching an app generated with this generator using the 'dist' build target, the Glyphicons do not render. Seems the font reference doesn't get added or the minification is out of sequence.

daveteply avatar May 17 '16 14:05 daveteply

Bower dependencies which contains assets are not easy to handle. Look at this recipes, it can give you some leads https://github.com/Swiip/generator-gulp-angular/blob/master/docs/recipes/add-fontawesome.md

Swiip avatar May 31 '16 07:05 Swiip

I'm having similar issues with both bootstrap & fontawesome. (also related to #849) Specifically, my issue is the dist version is compiling identically to the serve version. I installed them with bower, and included the fonts to the bower.json overrides:

"bootstrap": {
  "main": [
    "less/bootstrap.less",
    "dist/fonts/glyphicons-halflings-regular.eot",
    "dist/fonts/glyphicons-halflings-regular.svg",
    "dist/fonts/glyphicons-halflings-regular.ttf",
    "dist/fonts/glyphicons-halflings-regular.woff",
    "dist/fonts/glyphicons-halflings-regular.woff2"
  ]
},
"fontawesome": {
  "main": [
    "less/font-awesome.less",
    "fonts/fontawesome-webfont.eot",
    "fonts/fontawesome-webfont.svg",
    "fonts/fontawesome-webfont.ttf",
    "fonts/fontawesome-webfont.woff",
    "fonts/fontawesome-webfont.woff2"
  ]
}

(Obviously, I'm using less) Then, I override the font paths for both as appropriate.

@icon-font-path: "../bower_components/bootstrap/fonts/";
@fa-font-path: "../bower_components/fontawesome/fonts";

When I gulp serve this, everything is great - I'm serving the files from the declared dependencies. During build, the fonts task finds them and copies them (possibly the solution to #1129 - note my FA declaration does not have a dash in it). However, build runs the same styles task and nothing changes the paths so it fails to reference the correct path to the packaged font files.

In the recipe you link to, the replace sounds like it should do the trick, but maybe I'm not putting it in the right place? In any case, I can't get the build to generate the correct path.

end-user avatar Jun 03 '16 18:06 end-user