Jens Törnell Jens Törnell - 2 months ago 7
Sass (Sass) Question

Shorter way to import with Scss/Sass

I use Scss (gulp-sass) and it's a long list of includes that looks kind of like this:

@import '../../snippets/menu/menu.scss';
@import '../../snippets/footer/footer.scss';
@import '../../snippets/hero/hero.scss';


From this I can see a pattern. My question is if there is a nice way to make it simpler to write. Maybe something like this?

import('menu');
import('footer');
import('hero');


The output for scss should still be like the first snippet.

Answer

I was pushed in the right direction in the comments and the solution was a bit different than I expected. Now I use:

https://www.npmjs.com/package/gulp-sass-glob

I allows for syntax like this:

@import '../../snippets/**/*';