css - SCSS importing file without import -

so ran weird.. i'm using 7-1 pattern css needs. unfamiliar can read here: https://sass-guidelin.es/

i have _variables.scss file have css variables declared. question can access these variables in other .scss files without using import statement in particular file. can explain why?

edit: guess have main.scss file scss watching importing other files. time css attempting transpiled variables available in other files?

i'm gonna assume you've got 1 master import file, like:

@import 'variables' @import 'base' @import 'some_component' @import 'some_other_component' 

the reason variables available other stylesheets imports cascade. so, import variables, imported after in same scope variables (as they've been imported).

this can blessing , curse, variables define outside of block scope in of other stylesheets become globally available stylesheets imported after one.

because of this, it's considered best practice import variables global @ top of main import stylesheet, , block-scope local variables don't want expose globally, so:

.somecomponent {   $height: 100px; // accessible within block, , children of block;    .somecomponent-child {     height: $height;   } } 

conversely, variable defined in _variables.scss available everywhere, do:

.somecomponent {   $height: $global-height; // `$global-height` defined in `_variables.scss`     .somecomponent-child {     height: $height;   } }