Search code examples
javascriptsassgulpsusy-sass

Compiling SASS and SUSY with GULP


I am trying to get gulp to compile my sass and use the susy grid/framework.

I'm having troubles finding any information about this online.

I have included:

"gulp-ruby-sass": "^0.7.1",

into my package.json and installed everything.

My gulp sass gulp task likes like so:

gulp.task('sass', ['images'], function () {
  return gulp.src('src/sass/*.{sass, scss}')
    .pipe(sass({
      bundleExec: true,
      sourcemap: true,
      sourcemapPath: '../sass'
    }))
    .on('error', handleErrors)
    .pipe(gulp.dest('build'));
});

So I can't for the life of me work out how to include susy so it complies using gulp, I haven't looked and can't seem to find anything relating to this online.


Solution

  • You can use gulp-compass, you only need to have compass installed in your system and install gulp-compass package through npm, here is a sample code:

    var compass = require('gulp-compass');
    
    gulp.task('compass', function() {
      return gulp.src('./src/*.scss')
      .pipe(compass({
        // Gulp-compass options and paths
        css: 'app/assets/css',
        sass: 'app/assets/sass',
        require: ['susy']
      }))
      .on('error', handleErrors)
      .pipe(gulp.dest('app/assets/temp'));
    });
    

    More info about this package here