gulp-sass-multi-inheritance

Rebuild a sass/scss file with other files that have extended or included those file

(bug fix) Corrected gulp.dest() ways.

Based on gulp-sass-inheritance

And https://github.com/safareli commits https://github.com/berstend/gulp-sass-inheritance/pull/7/commits/2dad51187d6e9abf1704cffb4ed1f558a352b912

Uses sass-graph for the heavy lifting.

This package support _sass1.scss > _sass2.scss > .. > output.scss. And if you change _sass1.scss then only output.scss will build.

Install

npm install gulp-sass-multi-inheritance --save

Usage

You can use gulp-sass-multi-inheritance with gulp-changed to only process the files that have changed but also recompile files that import the one that changed.

'use strict';
var gulp = require('gulp');
var sassInheritance = require('gulp-sass-multi-inheritance');
var sass = require('gulp-sass');
var cached = require('gulp-cached');
var gulpif = require('gulp-if');

gulp.task('sass', function() {
    return gulp.src('src/styles/**/*.scss')

      //filter out unchanged scss files, only works when watching
      .pipe(gulpif(global.isWatching, cached('sass')))

      //find files that depend on the files that have changed
      .pipe(sassInheritance({dir: 'src/styles/'}))

      //process scss files
      .pipe(sass())

      //save all the files
      .pipe(gulp.dest('dist'));
});
gulp.task('setWatch', function() {
    global.isWatching = true;
});
gulp.task('watch', ['setWatch', 'sass'], function() {
    //your watch functions...
});

###Options

dir (string) for gulp.dest()

allowPathContain (string) it is only for using speacial case. For examle if we use one more directory in gulp.src() but gulp.dest() allow us only one directory output. More information will be come soon if I have find time.

debug (bool)

License

MIT