Sekhemty
Sekhemty

Reputation: 1532

Is it possible to use variables in SASS' @import rules?

As the title says, is it possible to use variables in SASS' @import rules?

As an example, if I need to import the following files

@import "./path/to/my/desired/file-1";
@import "./path/to/my/desired/file-2";
@import "./path/to/my/desired/file-3";

can I do something like this?

$dir: "./path/to/my/desired/";

@import $dir + "file-1";
@import $dir + "file-1";
@import $dir + "file-1";

Given that the previous was just an example of what I want to achieve, and that this syntax of course isn't working, is there some way to accomplish this?

Upvotes: 2

Views: 1533

Answers (1)

Quentin
Quentin

Reputation: 3289

From the Sass documentation:

It's not possible to dynamically import a Sass file based on a variable; interpolation is only for CSS imports. As such, it only works with url() imports.

So, yes.
You can import files using a Sass variable, but it just can't be a Sass file.

Example:

$foo: 'bar';
@import url('#{$foo}.css'); // will import `bar.css`

Upvotes: 4

Related Questions