Simple Node-Express Gulpfile

gulpfile.js

//general
var gulp = require('gulp');
var del = require('del');
var copy = require('gulp-copy');

//sass
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');

//images
var imagemin = require('gulp-imagemin');

//javascript
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var sourcemaps = require('gulp-sourcemaps');

//livereload
var livereload = require('gulp-livereload');

//////////////////////////////////////////////////
// Primary Tasks
//////////////////////////////////////////////////

gulp.task('serve', ['styles:dev', 'js:dev', 'images:dev'], function() {
  livereload.listen();

  gulp.watch('views/**/*.*', livereload.reload);
  gulp.watch(config.cssSrcDir + '/**/*.*', ['styles:dev']);
  gulp.watch(config.jsSrcDir + '/**/*.*', ['js:dev'], livereload.reload)
  gulp.watch(config.imgSrcDir + '/**/*.*', ['images:dev'])
});

gulp.task('build', ['styles:prod', 'images:prod', 'js:prod']);

gulp.task('deploy', ['clean'], function() {
  gulp.start('build');
});

gulp.task('default', function() {
  console.log('');
  console.log('');
  console.log('To develop, run "gulp serve"');
  console.log('- Sets up');
  console.log('  - JS/SCSS watch and compile');
  console.log('  - Dust watch');
  console.log('  - LiveReload serve');
  console.log('');
  console.log('To deploy for production, run "gulp deploy"');
  console.log('- Sets up');
  console.log('  - Cleans public folder');
  console.log('  - Generates final built files');
  console.log('');
  console.log('');
});

//////////////////////////////////////////////////
// Variables
//////////////////////////////////////////////////

var config = {
  cssSrcDir: 'client-src/scss',
  cssDestDir: 'public/css',
  autoprefixOptions: {
    browsers: ['> 1%', 'last 2 versions'],
    cascade: true,
    remove: true
  },
  imgSrcDir: 'client-src/img',
  imgDestDir: 'public/images', // should probably set a consistent img vs images
  jsSrcDir: 'client-src/libs',
  jsDestDir: 'public/js',
  publicDestDir: 'public'
};

//////////////////////////////////////////////////
// Task Details
//////////////////////////////////////////////////

//styles

gulp.task('clean', del.bind(null, [config.publicDestDir]));

gulp.task('styles:dev', function() {
  var files = config.cssSrcDir + '/**/*.scss';

  var sassOptions = {
    outputStyle: 'nested',
    sourceComments: true,
    sourceMap: true,
    souceMapEmbed: true
  }

  return gulp.src(files)
    .pipe(sass.sync(sassOptions).on('error', sass.logError))
    .pipe(autoprefixer(config.autoprefixOptions))
    .pipe(gulp.dest(config.cssDestDir))
    .pipe(livereload());
});

gulp.task('styles:prod', function() {
  var files = config.cssSrcDir + '/**/*.scss';

  var sassOptions = {
    outputStyle: 'compressed'
  };

  return gulp.src(files)
    .pipe(sass.sync(sassOptions).on('error', sass.logError))
    .pipe(autoprefixer(config.autoprefixOptions))
    .pipe(gulp.dest(config.cssDestDir));
});

gulp.task('js:dev', function() {
  // var files = config.jsSrcDir + '/**/*.js';
  // specify your files because of dependencies
  // OR if load order not needed, glob it like the line above
  // TODO: global js file array?

  var files = [
    config.jsSrcDir + '/jquery-2.1.3.min.js',
    config.jsSrcDir + '/jquery.cookie.min.js',
    config.jsSrcDir + '/*.js'
  ];

  //compress JS
  return gulp.src(files)
    .pipe(sourcemaps.init())
      .pipe(concat('scripts.js'))
    .pipe(sourcemaps.write('./maps'))
    .pipe(gulp.dest(config.jsDestDir));
});

gulp.task('js:prod', function() {
  // specify files because of dependencies

  var files = [
    config.jsSrcDir + '/jquery-2.1.3.min.js',
    config.jsSrcDir + '/jquery.cookie.min.js',
    config.jsSrcDir + '/*.js'
  ];

  return gulp.src(files)
    .pipe(concat('scripts.js'))
    .pipe(uglify())
    .pipe(gulp.dest(config.jsDestDir));
});

gulp.task('images:dev', function() {
  var files = config.imgSrcDir + '/**/*.{svg,png,jpg,gif}';
  //copy SVGs/PNGs/JPGs/GIFs (no compression for dev)

  return gulp.src(files)
    .pipe(copy(config.imgDestDir, {prefix: 2}));
});

gulp.task('images:prod', function() {
  var files = config.imgSrcDir + '/**/*.{svg,png,jpg,gif}';

  return gulp.src(files)
    .pipe(imagemin({
      progressive: true,
      interlaced: true,
      // don't remove IDs from SVGs, they are often used
      // as hooks for embedding and styling
      svgoPlugins: [
        {cleanupIDs: false}
      ]
    }))
    .on('error', function (err) {
      console.log(err);
      this.end();
    })
    .pipe(gulp.dest(config.imgDestDir));
});