Sass allows fallback to the behaviour of css @import, and allows to compile @import statements to plain CSS statements.
From the doc, sass will transpile to plain css for:
Imports where the URL ends with .css.
Imports where the URL begins http:// or https://.
Imports where the URL is written as a url().
Imports that have media queries.
Looks ok for url(), and seems legit for .css since it's a feature of fast-sass-loader (i think).
But using urls starting with protocol, e.g. http:// will break with fast-sass-loader.
I think it may also breaks for imports inside media queries.
ERROR in /myFile.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
HookWebpackError: Module build failed (from ./node_modules/fast-sass-loader/lib/index.js):
Error: import file cannot be resolved: "@import "https://fonts.googleapis.com/css?family=Playfair+Display:400i";" @/myFile.scss
at Object.importReplacer (x/node_modules/fast-sass-loader/lib/index.js:229:21)
It is working if using @import url("https://fonts.googleapis.com/css?family=Playfair+Display:400i"); but since i'm trying to implement a standard config of Stylelint, it forces me to ignore the import-notation rule that disallow using the url syntax.
Sass allows fallback to the behaviour of css
@import, and allows to compile@importstatements to plain CSS statements.From the doc, sass will transpile to plain css for:
Looks ok for
url(), and seems legit for.csssince it's a feature of fast-sass-loader (i think). But using urls starting with protocol, e.g.http://will break with fast-sass-loader. I think it may also breaks for imports inside media queries.will raise
It is working if using
@import url("https://fonts.googleapis.com/css?family=Playfair+Display:400i");but since i'm trying to implement a standard config of Stylelint, it forces me to ignore theimport-notationrule that disallow using the url syntax.