Basic gulpfile to compile sass with libsass and autoprefixer and reload the browser. Also has a function for a custom icon font.

Gulpfile.js

/**
 * Front end tasks.
 */

var gulp          = require('gulp');
var gutil         = require('gulp-util');
var plumber       = require('gulp-plumber');
var sass          = require('gulp-sass');
var sourcemaps    = require('gulp-sourcemaps');
var autoprefixer  = require('gulp-autoprefixer');
var livereload    = require('gulp-livereload');
var notify        = require('gulp-notify');
var changed       = require('gulp-changed');
var iconfont      = require('gulp-iconfont');
var consolidate   = require('gulp-consolidate');
var svgmin        = require('gulp-svgmin');
var cache         = require('gulp-cache');
var imagemin      = require('gulp-imagemin');

// Define variables for our paths
var paths = {
  sass: ['scss/*.scss', 'scss/**/*.scss'],
  css: './css',
  files: 'templates/*.php',
  js: 'js/*.js',
  img: 'images/*.{jpg,png,gif,svg}'
};

// Sass Tasks
// Set Sass and Autoprefix options here
gulp.task('sass', function() {
  return gulp.src(paths.sass)
    .pipe(plumber())
    .pipe(changed(paths.css))
    .pipe(sass({
      style: 'expanded',
      sourceComments: 'normal',
      errLogToConsole: false,
      onError: function(err) {
        return notify().write(err);
      }
    }))
    .pipe(autoprefixer('last 2 versions', 'ie 8', 'ie 9', 'android 4'))
    .pipe(gulp.dest(paths.css))
});

// Clear the gulp cache - run `gulp clear`
gulp.task('clear', function (done) {
  return cache.clearAll(done);
});

// Minify images and set up the folder for livereload. First run
// will minify all images, subsequent runs will minify only new or
// modified files
gulp.task('img', function() {
  return gulp.src(paths.img)
    .pipe(cache(imagemin({ optimizationLevel: 3, verbose: true })))
    .pipe(gulp.dest('images/'))
});

// Watch function
gulp.task('watch', function() {
  gulp.watch(paths.sass, ['sass']);
  gulp.watch(paths.img, ['img']);
  livereload.listen({ basePath: './**' });
  gulp.watch(['./css/*.css', 'templates/*.php', 'js/*.js', 'images/*.{jpg,png,gif,svg}' ]).on('change', livereload.changed);

});

// Define default task
gulp.task('default', ['watch']);

// Create icon font from a folder of SVGs
// Has to be run separately from default task
// To use, run `gulp icons`
gulp.task('icons', function(){
  gulp.src(['icons/*.svg'])
    .pipe(iconfont({
      fontName: 'vrwicons',
      appendCodepoints: true,
      normalize: true
    }))
    .on('codepoints', function(codepoints, options) {
      gulp.src('scss/fonts/templates/_vrwicons.scss')
        .pipe(consolidate('lodash', {
          glyphs: codepoints,
          fontName: 'vrwicons',
          fontPath: '../fonts/vrwicons/',
          className: 'vrwicon'
        }))
        .pipe(gulp.dest('scss/fonts'));
    })
    .pipe(gulp.dest('fonts/vrwicons'));
});