gulp-better-sass-inheritance

Recompile only changed sass/scss files and their dependencies (extended, included or imported).

Based on gulp-sass-inheritance-plus.

Solve the bugs in based plugin and make better performace.

NPM Page: https://www.npmjs.com/package/gulp-better-sass-inheritance

Usage

Install

npm i gulp-better-sass-inheritance -D

Gulp file

Suggest to work with gulp-sass.

var gulp = require('gulp');
var sassInheritance = require('gulp-better-sass-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({base: 'src/styles/'}))
 
      //process scss files 
      .pipe(sass())
 
      //save all the files 
      .pipe(gulp.dest('dist'));
});

gulp.task('watch', ['sass', 'other-task'], function() {
	global.isWatching = true;
    //your watch functions... 
});