Level 88
Have you tried using double quotes instead of single quotes?
Aug 29, 2020
6
Level 1
Problem with google fonts
Hello, I'm having a problem with importing google fonts in app.scss
here is my import line from google fonts:
@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Changa:wght@200;400;800&family=Nunito:wght@200;400;800&display=swap');
the compiled css file is break after the semicolon ';'
here is my compiled css
@import url(https://fonts.googleapis.com/css2?family=Amiri:wght@400;
700&family=Changa:wght@200;400;800&family=Nunito:wght@200;400;800&display=swap);@charset "UTF-8";
thanks
Level 1
@bobbybouwmann , thanks, yes, I did try double quotes, it is the same as single quotes.
Level 88
So the problem seems to be the ; that is used in the URL.
Have you tried including the font URL in the <head> tag instead of your CSS, to see if that works?
1 like
Level 1
yes, I'm currently using the head tag to import my fonts @bobbybouwmann thanks a lot .
Level 88
@engamoktar I always use the head tag with these fonts, to be honest. They only need to be loaded to make them work in your CSS of course.
1 like
Level 1
The compiler treats the first semicolon as a line break. The issue is still not fixed, but there is a workaround: use "%3b" instead of ";"
https://github.com/JeffreyWay/laravel-mix/issues/2430#issuecomment-653915587
Please or to participate in this conversation.