Sass Imports with Sass Globbing

29 / Jul / 2016 by Priyanka Singhal 0 comments

If we are using Sass to preprocess stylesheets, we must have knowledge about partials. A partial is a sub-stylesheet, intended to be included as part of a main stylesheet. So as to avoid adding “partials” every time, we can use the sass-globbing gem to remove the extra overhead.

Sass Globbing to rescue

Sass-globbing is a Ruby gem for Sass. It lets us import directories or whole directory trees with a single @import statement:
Instead of including absolute paths for eg:

[html]
// Modules and Variables
@import "partials/base";
// Partials
@import "partials/reset";
@import "partials/typography";
@import "partials/buttons";

[/html]
We can do something like this:
[html]
@import "partials/*";
@import "partials/**/*"

[/html]
The first one includes all the files in the partials folder.
The second one includes all the files in the partials folder recursively.

To start using the gem, we’ll install it from the command line:

[html]
$ gem install sass-globbing
[/html]

after this installation we can easily import the partials folder.

Usage of Sass command line

When we are using scss global plugin then we convert scss to css using below command:
[html]
$ sass -r sass-globbing –watch sass_dir:css_dir
[/html]

FOUND THIS USEFUL? SHARE IT

Leave a Reply

Your email address will not be published. Required fields are marked *