gulpfile.js

var gulp = require('gulp'),
    connect = require('connect'),
    http = require('http'),
    open = require('open'),
    rimraf = require('gulp-rimraf'),
    jshint = require('gulp-jshint'),
    concat = require('gulp-concat'),
    uglify = require('gulp-uglify'),
    sass = require('gulp-sass'),
    minifycss = require('gulp-minify-css'),
    refresh = require('gulp-livereload'),
    useref = require('gulp-useref'),
    tinylr = require('tiny-lr'),
    livereload = tinylr(),
    config = {
        app: 'app',
        dist: 'dist',
        port: 9000,
        scripts: function () {
            return this.app + '/scripts/*.js';
        },
        styles: function () {
            return this.app + '/styles';
        },
        html: function () {
            return this.app + '/*.html';
        },
        lr: 35729
    };

config.scripts.apply(config);
config.styles.apply(config);
config.html.apply(config);

gulp.task('clean', function() {
    return gulp.src(config.dist, {read: false})
        .pipe(rimraf());
});

gulp.task('lint', function() {
    var path = config.scripts();

    return gulp.src(path)
        .pipe(jshint())
        .pipe(jshint.reporter('default'));
});

gulp.task('sass', function () {
    var dir = config.styles();

    return gulp.src(dir + '/*.scss')
        .pipe(sass({
            includePaths: [ dir + '/partials' ],
            outputStyle: 'expanded'
        }))
        .pipe(gulp.dest(dir))
        .pipe(refresh(livereload));
});

gulp.task('connect-livereload', function(){
    var middleware = [
        require('connect-livereload')({ port: config.lr }),
        connect.static(config.app),
        connect.directory(config.app)
    ];

    var app = connect.apply(null, middleware);

    var server = http.createServer(app);

    server
        .listen(config.port)
        .on('listening', function() {
            console.log('Started connect web server on http://localhost:' + config.port + '.');

            open('http://localhost:' + config.port);
        });
});

gulp.task('tinylr', function(){
    livereload.listen(config.lr, function(err){
        if (err) {
            return console.log(err);
        }
    });
});

gulp.task('server', ['sass', 'connect-livereload', 'tinylr'], function(){
    var jsPath = config.scripts(),
        cssPath = config.styles(),
        htmlPath = config.html();

    var sassWatch = gulp.watch(cssPath + '/**/*.scss', ['sass']);
    sassWatch.on('changed', function(event){
        console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');
    });

    gulp.watch(jsPath, function(event){
        console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');

        gulp.src(jsPath)
            .pipe(refresh(livereload));
    });

    gulp.watch(htmlPath, function(event){
        console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');

        gulp.src(htmlPath)
            .pipe(refresh(livereload));
    });
});

gulp.task('scripts', ['lint'], function(){
    var path = config.scripts();

    return gulp.src([config.app + '/bower_components/jquery/jquery.js', path])
        .pipe(concat('main.js'))
        .pipe(uglify())
        .pipe(gulp.dest(config.dist + '/scripts'));
});

gulp.task('styles', ['sass'], function(){
    var dir = config.styles();

    return gulp.src([config.app + '/bower_components/normalize-css/normalize.css', dir + '/*.css'])
        .pipe(concat('main.css'))
        .pipe(minifycss({ keepBreaks: true }))
        .pipe(gulp.dest(config.dist + '/styles'));
});

gulp.task('images', function(){
    return gulp.src(config.app + '/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}')
        .pipe(gulp.dest(config.dist + '/images'));
});

gulp.task('fonts', function(){
    var cssPath = config.styles();

    return gulp.src(cssPath + '/fonts/*')
        .pipe(gulp.dest(config.dist + '/styles/fonts'));
});

gulp.task('misc', function(){
    return gulp.src([
            config.app + '/*.{ico,png,txt}',
            config.app + '/.htaccess'
        ])
        .pipe(gulp.dest(config.dist));
});

gulp.task('html', function(){
    var htmlPath = config.html();

    return gulp.src(htmlPath)
        .pipe(useref())
        .pipe(gulp.dest(config.dist));
});

gulp.task('build', ['clean'], function(){
    gulp.run('images', 'styles', 'fonts', 'misc', 'scripts', 'html');
});

package.json

{
  "name": "test-project",
  "version": "0.0.0",
  "devDependencies": {
    "gulp": "~3.2.2",
    "connect": "~2.12.0",
    "gulp-sass": "~0.2.3",
    "tiny-lr": "0.0.5",
    "gulp-livereload": "~0.1.1",
    "open": "0.0.4",
    "connect-livereload": "~0.3.2",
    "gulp-jshint": "~1.3.4",
    "gulp-rimraf": "0.0.8",
    "gulp-concat": "~2.1.7",
    "gulp-uglify": "~0.1.0",
    "gulp-useref": "~0.1.1",
    "gulp-minify-css": "~0.2.0"
  }
}