My web development gulpfile

gulpfile.js

var browserSync = require('browser-sync');
var del = require('del');
var gulp = require('gulp');
var plugins = require('gulp-load-plugins')();
var runSequence = require('run-sequence');

var paths = {
  images: "source/**/*.{png,svg,jpg}",
  styles: "source/**/*.{css,scss}",
  templates: "source/**/*.swig",
  source: "source",
  tmp: ".tmp",
  build: "build",
  layout: "source/shared/layout.swig"
};

// Optimize images and copy them to the build directory
gulp.task('images', function () {
  return gulp.src(paths.images)
    .pipe(plugins.cache(plugins.imagemin({ progressive: true, interlaced: true })))
    .pipe(gulp.dest('build'));
});

// Compile styles and copy them to the build directory.
gulp.task('styles', function () {
  return gulp.src(paths.styles)
    .pipe(plugins.sourcemaps.init())
    .pipe(plugins.sass({ precision: 10, onError: plugins.util.log }))
    .pipe(plugins.autoprefixer({ browsers: [ 'ie >= 10', 'android >= 4.1' ] }))
    .pipe(plugins.sourcemaps.write())
    .pipe(gulp.dest('.tmp'))
    .pipe(plugins.csso())
    .pipe(gulp.dest('build'));
});

// Compile templates and copy them to the build directory.
gulp.task('templates', function() {
  return gulp.src(paths.templates)
    .pipe(plugins.frontMatter({ property: 'data' }))
    .pipe(plugins.wrap({ src: paths.layout }))
    .pipe(plugins.swig({ defaults: { cache: false } }))
    .on("error", plugins.util.log)
    .on("error", function() { this.emit("end"); })
    .pipe(gulp.dest(paths.tmp))
    .pipe(plugins.minifyHtml())
    .pipe(gulp.dest(paths.build));
});

// Remove the build directory.
gulp.task('clean', del.bind(null, [ paths.tmp, paths.build ], { dot: true }));

// Watch files for changes and reload the page in the browser when they do.
gulp.task('watch', [ 'images', 'styles', 'templates' ], function() {
  browserSync({ notify: false, server: [ paths.tmp, paths.source ] });
  gulp.watch([ paths.templates ], [ 'templates', browserSync.reload ]);
  gulp.watch([ paths.styles ], [ 'styles', browserSync.reload ]);
  gulp.watch([ paths.images ], browserSync.reload);
});

// Build the source and serve the result.
gulp.task('watch:build', [ 'build' ], function () {
  browserSync({ notify: false, server: 'build' });
});

// Build the source.
gulp.task('build', [ 'clean' ], function (callback) {
  runSequence([ 'styles', 'templates', 'images' ], callback);
});

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

package.json

{
  "devDependencies": {
    "browser-sync": "^1.3.0",
    "del": "^1.1.0",
    "gulp": "^3.8.5",
    "gulp-autoprefixer": "^2.0.0",
    "gulp-cache": "0.2.2",
    "gulp-coffee": "*",
    "gulp-csso": "^1.0.0",
    "gulp-debug": "*",
    "gulp-imagemin": "^2.0.0",
    "gulp-front-matter": "^1.2.3",
    "gulp-load-plugins": "^0.8.0",
    "gulp-minify-html": "0.1.5",
    "gulp-sass": "^1.2.0",
    "gulp-sourcemaps": "^1.3.0",
    "gulp-swig": "^0.7.4",
    "gulp-uglify": "^1.0.1",
    "gulp-util": "*",
    "gulp-wrap": "^0.11.0",
    "opn": "^1.0.0",
    "run-sequence": "^1.0.1"
  },
  "engines": {
    "node": ">=0.10.0"
  },
  "private": true
}