gulp-inline-css
gulp-inline-css copied to clipboard
Error on style @import font
Error message:
Message: 8: ")" not found
After added this conditional tags
<!--[if !mso]><!-- -->
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&subset=latin-ext" rel="stylesheet" type="text/css">
<style type="text/css">
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&subset=latin-ext);
</style>
<!--<![endif]-->
@srocevas I reckon you found a way around this somehow since then, but in case you never figured out the problem, it is caused by the semicolon (;
) in your @import
statement:
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&subset=latin-ext);
You should be able to use the ampersand (&
) directly without URL-encoding it to &
:
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&subset=latin-ext);
In my case, the issue (still) arises because of Google Fonts API v2's use of semicolons in their new syntax for individual weights:
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');
The only workaround I found so far consists of using a weight range (..
) instead:
@import url('https://fonts.googleapis.com/css2?family=Poppins:[email protected]&display=swap');
@jonkemp Would it be possible for you to look into this?