gulp-sass

Sass plugin for gulp.

Install

npm install gulp-sass --save-dev

Basic Usage

Something like this:

var gulp = require('gulp');
var gutil = require('gulp-util');
var sass = require('gulp-sass');

gulp.task('sass', function () {
	gulp.src('./scss/*.scss')
		.pipe(sass().on('error', gutil.log))
		.pipe(gulp.dest('./css'));
});

Options passed as a hash into sass() will be passed along to node-sass.

Source Maps TODO

gulp-sass can be used in tandem with gulp-sourcemaps to generate source maps for the SASS to CSS compilation. You will need to initialize gulp-sourcemaps prior to running the gulp-sass compiler and write the source maps after.

var sourcemaps = require('gulp-sourcemaps');

gulp.src('./scss/*.scss')
  .pipe(sourcemaps.init())
    .pipe(sass())
  .pipe(sourcemaps.write())
  .pipe(gulp.dest('./css'));

// will write the source maps inline in the compiled CSS files

By default, gulp-sourcemaps writes the source maps inline in the compiled CSS files. To write them to a separate file, specify a relative file path in the sourcemaps.write() function.

var sourcemaps = require('gulp-sourcemaps');

gulp.src('./scss/*.scss')
  .pipe(sourcemaps.init())
    .pipe(sass())
  .pipe(sourcemaps.write('./maps'))
  .pipe(gulp.dest('./css'));

// will write the source maps to ./dest/css/maps

Issues

Before submitting an issue, please understand that gulp-sass is only a wrapper for node-sass, which in turn is a node front end for libsass. Missing sass features and errors should not be reported here.