Is there anyway to import a regular CSS file with Sass's @import
command? While I'm not using all of the SCSS syntax from sass, I do still enjoy it's combining/compressing features, and would like to be able to use it without renaming all of my files to *.scss
After having the same issue, I got confused with all the answers here and the comments over the repository of sass in github.
I just want to point out that as December 2014, this issue has been resolved. 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. If you append *.css
at the end, it will translate into the css
rule @import url(...)
.
In case you are using some of the "fancy" new module bundlers such as webpack, you will probably need to use use ~
in the beginning of the path. So, if you want to import the following path node_modules/bootstrap/src/core.scss
you would write something like @import "~bootstrap/src/core"
.
NOTE:
It appears this isn't working for everybody. If your interpreter is based on libsass
it should be working fine (checkout this). I've tested using @import
on node-sass and it's working fine. Unfortunately this works and doesn't work on some ruby instances.