Menu
I am using gulp as a task runner which merge and minifying scss files for me. In this case if I try to import a regular CSS file, it will compile to a css import statement as below:
/* style.scss */
@import "../../bower_components/animate.css/animate.css";
/* style.css */
@import url(../../bower_components/animate.css/animate.css);
So how to import that regular css file, to have a compiled version of that in the style.css instead of just css @import statement?
594
It is now possible to import css files directly into your sass file. The following PR in github solves the issue. The syntax is the same as now - @import "your/path/to/the/file" , without an extension after the file name. This will import your file directly.
scss files, Sass can import plain old . css files. The only rule is that the import must not explicitly include the . css extension, because that's used to indicate a plain CSS @import .
sass or . scss file. You can also import CSS files. The @import directive imports the file and any variables or mixins defined in the imported file can then be used in the main file.
The @import rule, and most global functions will eventually be deprecated, and then removed from Sass.
Simply do this:
/* style.scss */
@import "../../bower_components/animate.css/animate";
Just don't write file extension, Import the file without the extension, the compiler will put the file content in style.css instead of putting @import rule.
192
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With