Webpack sass loader does not recognize global variables file

Question

i have this sass directory:

- _vars.scss
- main.scss

//vars.scss

$base-container: 1400px;

//main.scss

Answer 1

You have to import the vars file into every Sass partial that uses those variables, because every partial is compiled on its own; none of the files will 'know about' the others unless you specifically import them.

If you don't want to have to type the imports in every Sass file, you can look at baggage-loader, which will automatically add them for you.