Dmitriy Doronin Dmitriy Doronin - 3 years ago 263
Sass (Sass) Question

How to define sass variables for all scss files

In my project i use many scss files (more than 100 files).
The file structure is similar to the BEM project.

scss/
--block/block.scss
----/__elem/block__elem.scss
--menu/menu.scss
----/__elem/menu__elem.scss


and etc...

All files compiled to css files with gulp-sass plugin and concatenated to 1 css file app.css

The same folder i have 2 scss files.

_variables.scss - for define custom variables

style.scss - main file (i use that file to import my variables).

scss/

_variables.scss

style.scss


In style.scss file contained import line with variables

@import "utilities/variables";


Yes, all variables is successful define in style.scss file, but how to define my variables for others scss files (for all scss files in folders and subfolders)?

For another files except style.scss in gulp project gives an error message:

out: error sass/menu/menu.scss (Line 5: Undefined variable: "$laptop".)


Thanks in advance.

Answer Source

I solved this problem. Now i just concatenate all scss file with variables and only then connect them to the general css. Something like this:

sass/**/*.scss + _variables.scss> app.scss > app.css
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download