Dealing with Gulp, Bundler, Ruby and Susy

According to this it's possible to compile susy install from Ruby with Gulp. But is it possible to use gulp-sass instead of gulp-compass or gulp-ruby-sass because of performance and deprecation ? Actually I use this in my gulpfile.js:

gulpfile

var gulp = require('gulp');

// Include plugins
var plugins = require('gulp-load-plugins')();

// Variables de chemins
var source = './sass/**/*.scss'; // dossier de travail
var destination = './css/'; // dossier à livrer   

gulp.task('sasscompil', function () {
  return gulp.src(source)
  .pipe(plugins.sass({
      outputStyle: 'compressed',
      includePaths: ['/home/webmaster/vendor/bundle/gems/susy-2.2.2/sass']
  }).on('error', sasscompil.logError))
  .pipe(plugins.csscomb())
  .pipe(plugins.cssbeautify({indent: '  '}))
  .pipe(plugins.autoprefixer())
  .pipe(gulp.dest(destination + ''));
});

But the error log doesn't work because sasscompil isn't define. Then I need to give the path for all ex-compass includes like susy, sassy-button,etc.. is it possible to give a global path for gems ? other thing, do I install gulp plugins despite of using gulp-load-plugins ? because gulp doesn't find plugins if I don't do that.

Thanks

Solution

You need to change sasscompil.logError to plugins.sass.logError

such that

gulpfile.js

gulp.task('sasscompil', function () {
  return gulp.src(source)
  .pipe(plugins.sass({
      outputStyle: 'compressed',
      includePaths: ['/home/webmaster/vendor/bundle/gems/susy-2.2.2/sass']
  }).on('error', plugins.sass.logError))
...
});

gulp-sass doc:

Pass in options just like you would for node-sass; they will be passed along just as if you were using node-sass. Except for the data option which is used by gulp-sass internally. Using the file option is also unsupported and results in undefined behaviour that may change without notice.

example

gulp.task('sass', function () {
 return gulp.src('./sass/**/*.scss')
   .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
   .pipe(gulp.dest('./css'));
});