GeezerVison is showing github.com — Version 4.0.1 stable, boostrap glyphicons don't seem to work · Issue #2188 · angular-fullstack/generator-angular-fullstack
This repository was archived by the owner on Jul 29, 2026. It is now read-only.
This repository was archived by the owner on Jul 29, 2026. It is now read-only.
Version 4.0.1 stable, boostrap glyphicons don't seem to work #2188Description
- I understand that GitHub issues are not for tech support, but for questions specific to this generator, bug reports, and feature requests.
| Item |
Version |
| generator-angular-fullstack |
4.0.1 |
| Node |
4.2.6 |
| npm |
3.5.2 |
| Operating System |
Ubuntu 16.04 LTS |
| etc |
etc |
| Item |
Answer |
| Transpiler |
Babel |
| Markup |
HTML |
| CSS |
CSS |
| Router |
ui-router |
| Client Tests |
Mocha |
| DB |
MongoDB |
| Auth |
Y |
After I run npm install, and gulp serve the glypicons don't seem to work. They are just missing/square characters. I tried both in chrome and firefox.
If I access the font files from the browser like this they get downloaded:
localhost:3000/assets/fonts/bootstrap/glyphicons-halflings-regular.svg
However I don't understand why they are not showing up correctly in the browser. ActivityAwk34 commented on Aug 30, 2016 marius-avram commented on Aug 31, 2016 I get some errors when i'm starting the apps from gulp. I don't know if they are of any relevance.
[11:13:27] Starting 'serve'...
[11:13:27] Starting 'clean:tmp'...
[11:13:27] Starting 'lint:scripts'...
[11:13:27] Starting 'lint:scripts:client'...
[11:13:27] Starting 'lint:scripts:server'...
[11:13:27] Starting 'inject'...
[11:13:27] Starting 'inject:css'...
[11:13:27] Starting 'copy:fonts:dev'...
[11:13:27] Starting 'env:all'...
[11:13:27] Finished 'env:all' after 149 ms
[11:13:27] Finished 'clean:tmp' after 532 ms
[11:13:31] gulp-inject 5 files into app.css.
[11:13:31] Finished 'inject:css' after 3.97 s
[11:13:31] Finished 'inject' after 3.97 s
[11:13:34] Finished 'copy:fonts:dev' after 7.02 s
[11:13:35]
~/server/app.js
16:17 warning Unexpected string concatenation prefer-template
...
✖ 92 problems (68 errors, 24 warnings)
[11:13:35] Finished 'lint:scripts:client' after 8.56 s
[11:13:35] Finished 'lint:scripts' after 8.56 s
[11:13:35] Starting 'start:server'...
[11:13:35] Finished 'start:server' after 17 ms
[11:13:35] Starting 'start:client'...
[nodemon] 1.10.2
I don't get any errors in the browser console however. marius-avram commented on Aug 31, 2016 Awk34 commented on Aug 31, 2016 Awk34 commented on Aug 31, 2016 @marius-avram if you look in the network tab of your browser tools, do you see the font files getting loaded? DanielClausen commented on Sep 5, 2016 I'm having this same issue, but I'm running on Windows not Ubuntu. None of the custom fonts are being loaded, neither bootstrap, font-awesome, or my custom fonts. There is no font files in the network tab on Chrome. I've checked the outputted app.css file and it has the font-face nodes. I'm not seeing any errors related to fonts it just seems like the browser isn't even attempting to load the fonts even though they are defined in the CSS. chandruk4321 commented on Sep 22, 2016 joelvictoraluiz commented on Oct 4, 2016 mfsjr commented on Dec 14, 2016 Getting the same with 4.1.0, just noting a few additional observations:
- Glyphs are missing with Chrome and Firefox but not Safari
- gulp builds, i.e., running the /dist build from the command line doesn't have the problem
- Creating the project with SCSS instead of CSS doesn't exhibit the problem
zaphinath commented on Dec 18, 2016 +1 OSX. Using CSS and not SCSS duoli commented on Dec 28, 2016 +1 on Ubuntu with chrome. duoli commented on Dec 28, 2016 to be clarified, with 'glyphicon glyphicon-home', I get the following icon instead.
It seems all the glyphicons are shifted to a different one.
generator-angular-fullstack 4.0.1
Node ^6.2.2
npm ^3.9.5
bootstrap: ~3.1.1
Operating System Ubuntu 16.04 LTS
etc etc Awk34 commented on Dec 28, 2016 Try using this for the font in app.css:
/**
*Font Awesome Fonts
*/
@font-face {
font-family: 'FontAwesome';
src: url('~font-awesome/fonts/fontawesome-webfont.eot?v=4.1.0');
src: url('~font-awesome/fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'),
url('~font-awesome/fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'),
url('~font-awesome/fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'),
url('~font-awesome/fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
font-weight: normal;
font-style: normal;
}Scratch that, I've tested an actual solution mfsjr commented on Dec 28, 2016 Sorry, but replacing the font in app.css described above did not fix my issue with 4.1.0 on OSX with Chrome and Firefox. Awk34 commented on Dec 28, 2016 Instead, try changing this line in webpack.make.js:
? ExtractTextPlugin.extract('style', 'css?sourceMap!postcss')to this:
? ExtractTextPlugin.extract('style', 'css!postcss')added a commit that references this issue on Dec 28, 2016This issue will close once commit d48f0b0 is merged into the 'master' branch.d48f0b0 mfsjr commented on Dec 29, 2016 Appears that webpack.make.js change above fixed it - thanks! abbas133 commented on Jan 1, 2017 MichaelJCole commented on May 15, 2017 Hey, if you're getting this with: npm start, it seems to be designed to work after gulp build. If you want to run a development server, use gulp serve Reacted by Pi Home Server
MetadataMetadataDevelopmentNo branches or pull requestsIssue actions
|
