Kevin Powell - Community•14mo ago

is this a sass bug?

so, i wanted to try to get configurations a lot easier, and skirt around the hideous map-get i though i would try to @use modules so, i wrote something like this: style.scss

@use 'config';

body {
    background: config.$body-bg;
}

@use 'config';

body {
    background: config.$body-bg;
}

_config.scss

@use 'config/color' as *;

@use 'config/color' as *;

config/_color.scss

$body-bg: rebeccapurple;

$body-bg: rebeccapurple;

however, this gives me an "undefined variable config.$body-bg;" and according to the documentation, using as * will load everything without a namespace i would assume that it should work, since everything in config/color.scss is loaded into config.scss the documentation doesnt say otherwise... is this a bug? or i'm missing something? --- yes, im aware that removing as * from _config.scss and adding $body-bg: color.$body-bg will work

6 Replies

MarkBoots•14mo ago

Not able to verify, but think it has to do with this

Members (variables, functions, and mixins) loaded with @use are only visible in the stylesheet that loads them. Other stylesheets will need to write their own @use rules if they also want to access them.

https://sass-lang.com/documentation/at-rules/use/#loading-members you could try it with a forward (don't know if that fits your purpose)

// style.scss
@use 'config';
body {
    background: config.$body-bg;
}

// style.scss
@use 'config';
body {
    background: config.$body-bg;
}

// config.scss
@forward 'config/color';

// config.scss
@forward 'config/color';

Sass: @use

Syntactically Awesome Style Sheets

ἔρωςOP•14mo ago

holy moly i didnt knew about @forward it does what i need just replacing @use with @forward in _config.scss does what i expected thank you

MarkBoots•14mo ago

perfect. you're welcome

ἔρωςOP•14mo ago

and apparently i can do @forward 'config/color' as color-*; to automatically change $body-bg to $color-body-bg which is just awesome!

ἔρωςOP•14mo ago

and the type thingy works too 😮

ἔρωςOP•14mo ago

i guess i found a new shiny toy to play with

Gaming

Programming

is this a sass bug?

Did you find this page helpful?