gulpfile.js

// npm install browser-sync gulp-ruby-sass gulp-autoprefixer gulp-cssnano jshint gulp-jshint gulp-concat gulp-uglify gulp-imagemin gulp-notify gulp-rename gulp-cache gulp-htmlmin del --save-dev

var gulp = require('gulp'),
	browserSync = require('browser-sync').create(),
	reload = browserSync.reload,
	sass = require('gulp-ruby-sass'),
	autoprefixer = require('gulp-autoprefixer'),
	nano = require('gulp-cssnano'),
	jshint = require('gulp-jshint'),
	uglify = require('gulp-uglify'),
	imagemin = require('gulp-imagemin'),
	rename = require('gulp-rename'),
	concat = require('gulp-concat'),
	notify = require('gulp-notify'),
	cache = require('gulp-cache'),
	del = require('del'),
	htmlmin = require('gulp-htmlmin');

gulp.task('browser-sync', function() {

	var files = [
			'**/*.html',
			'**/*.css',
			'**/*.{png,jpg,gif}'
			];

	browserSync.init(files, {
		// logLevel: "debug",
		// proxy: "projectname.dev",
		// tunnel: "projectname",
		// serveStatic: ['./src/'],
		// baseDir: "./",
		xip: true,
		server: "./dist/"
	})
});

gulp.task('styles', function() {
	return sass('src/assets/stylesheets/**/*.scss', { style: 'expanded' })
		.pipe(autoprefixer('last 2 version'))
		.pipe(concat('global.css'))
		.pipe(gulp.dest('dist/assets/css'))
		.pipe(rename({suffix: '.min'}))
		.pipe(nano())
		.pipe(gulp.dest('dist/assets/css'));
		// .pipe(notify({ message: 'Styles task complete', onLast: true }));
});

gulp.task('scripts', function() {
	return gulp.src('src/assets/javascripts/**/*.js')
		.pipe(jshint('.jshintrc'))
		.pipe(jshint.reporter('default'))
		.pipe(concat('main.js'))
		.pipe(gulp.dest('dist/assets/js'))
		.pipe(rename({suffix: '.min'}))
		.pipe(uglify())
		.pipe(gulp.dest('dist/assets/js'));
		// .pipe(notify({ message: 'Scripts task complete', onLast: true }));
});

gulp.task('images', function() {
	return gulp.src('src/assets/images/**/*')
		.pipe(cache(imagemin({ optimizationLevel: 5, progressive: true, interlaced: true })))
		.pipe(gulp.dest('dist/assets/img'));
		// .pipe(notify({ message: 'Images task complete' }));
});

gulp.task('html-min', function() {
	return gulp.src('src/*.html')
		.pipe(htmlmin({collapseWhitespace: false}))
		.pipe(gulp.dest('dist'))
		.pipe(htmlmin({collapseWhitespace: true}))
		.pipe(rename({suffix: '.min'}))
		.pipe(gulp.dest('dist'));
		// .pipe(notify({ message: 'HTML task complete', onLast: true }));
});

gulp.task('clean', function() {

	return del(['dist/assets/css', 'dist/assets/js', 'dist/assets/img']);
});

gulp.task('default', ['clean'], function() {

	gulp.start('browser-sync', 'styles', 'scripts', 'images', 'html-min');

	// Watch .scss files
	gulp.watch('src/assets/stylesheets/**/*.scss', ['styles']);

	// Watch .js files
	gulp.watch('src/assets/scripts/**/*.js', ['scripts']);

	// Watch image files
	gulp.watch('src/assets/images/**/*', ['images']);

	// Watch image files
	gulp.watch('src/*.html', ['html-min']);
});