Daniel
Daniel

Reputation: 11

(SCSS/SASS) Way to import whole document without @import

I have multiple SCSS files that I want to import into one main SCSS file. I want ALL of the contents of that file to be imported, basically copying the entire document into the other one. Currently, I am using @import, which is exactly what I need. But now it has been announced that it will be removed from SCSS, and I'm afraid that @use cannot replicate this functionality that I need. With @use, I can only import selected variables, classes etc., but I want the entire file.

Two possible solutions (that I don't want to go for): A) Writing everything in the same file. But that would become quite messy. I have one template SCSS file with variables and utility classes (a lot of them), and 3 other files for custom code (so the CSS of a site can be changed by multiple people at the same time, having only one file would limit it to one person at a time) B) Loading multiple stylesheets on the site. That would be the better option, but that would cause a lot of unnecessary requests on the server.

Any ideas? I'm using SCSS in Wordpress. Will the @import rule be unusable once it's been removed from the language? What if I didn't update the Plugin that compiles the SCSS? It's frustrating because the current @import rule does exactly what I need...

Thank you!

Upvotes: 1

Views: 159

Answers (1)

Daniel
Daniel

Reputation: 11

The question is more or less resolved. I was trying to migrate from @import to @use in an environment that does not support the @use rule at all. As I said, I'm using a Wordpress plugin to compile. @use is only available in Dart Sass and upon using it in my setup, the compiler would throw errors, as it is based on phpsass, which does not have @use or @forward and still uses @import. Which make everything a lot easier!

Upvotes: 0

Related Questions