gulp-inline-css
gulp-inline-css copied to clipboard
Error on style @import font
trafficstars
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?