Angular project production build has problem importing google fonts

user_1516665 0
Viewed 1152

I have an angular project built on latest version 8.2.9. Google fonts works perfectly while on the test environment using ng serve. However when I publish the project on the production server the fonts are not loaded.

style.scss

@import url('https://fonts.googleapis.com/css?family=Nunito:200,600');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');

Due to the above mentioned problem the material icons doesn't loads as shown in the image.enter image description here

However, when I move the above fonts loading statement from global style style.scss to app.component.scss. It works fine! Any reason why it is not working on the global style? I found something similar to this issue here ng build/serve --prod ignores scss url imports

google-fonts angular-material angular
1 Answers

Simply include google fonts into index.html in <head> tag instead of any scss or css file.

It will also work for production build.

http://prntscr.com/qx71rf

user_44699230
Related