philippdrebes/Gulpfile.js

## Gulpfile.js
var gulp = require('gulp'),
	sass = require('gulp-sass'),
	autoprefixer = require('gulp-autoprefixer'),
	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'),
	livereload = require('gulp-livereload'),
	connect = require('gulp-connect'),
	lr = require('tiny-lr'),
	server = lr();

// Server - listed on localhost:8080
gulp.task('webserver', function() {
  connect.server();
});

gulp.task('styles', function() {
  return gulp.src('sass/styles.scss')
	.pipe(sass({ style: 'expanded' }))
	.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
	.pipe(gulp.dest('css'))
	.pipe(notify({ message: 'Styles task complete' }));
});

// Concatenate & Minify JS
gulp.task('scripts', function() {
	return gulp.src('js/*.js')
		.pipe(concat('all.js'))
		.pipe(gulp.dest('dist'))
		.pipe(rename('all.min.js'))
		.pipe(uglify())
		.pipe(gulp.dest('dist'));
});

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

// Watch
gulp.task('watch', function() {

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

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

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

  // Create LiveReload server
  var server = livereload();

  // Watch any files in dist/, reload on change
  gulp.watch(['css/**','js/**','img/**','*.html']).on('change', function(file) {
	server.changed(file.path);
  });

});

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

## index.html
<!DOCTYPE html>
<html class="no-js">
	<head>
		<meta charset="utf-8">
		<title>Description here</title>
		<meta name="author" content="Ben Frain - http://benfrain.com">
		<meta name="description" content="Desc">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<link rel="stylesheet" href="css/styles.css">
		<script src="bower_components/modernizr/modernizr.js"></script>
	</head>
	<body>

		<script src="bower_components/jquery/dist/jquery.min.js"></script>
		<script src="js/main.js"></script>
		<script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
	</body>
</html>

## package.json
{
	"name": "Quick-setup",
	"description": "Basic Gulp niceties for rapidly building stuff",
	"version": "0.0.2",
	"author": "Ben Frain",
	"private": true,
	"devDependencies": {
		"gulp": "~3.8.0",
		"gulp-autoprefixer": "2.0.0",
		"gulp-cache": "~0.2.4",
		"gulp-concat": "~2.4.2",
		"gulp-connect": "^2.2.0",
		"gulp-imagemin": "~2.0.0",
		"gulp-jshint": "~1.9.0",
		"gulp-livereload": "~2.1.0",
		"gulp-notify": "~2.0.1",
		"gulp-rename": "~1.2.0",
		"gulp-sass": "~1.1.0",
		"gulp-uglify": "~1.0.1",
		"tiny-lr": "0.0.7"
	}
}
	var gulp = require('gulp'),
	sass = require('gulp-sass'),
	autoprefixer = require('gulp-autoprefixer'),
	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'),
	livereload = require('gulp-livereload'),
	connect = require('gulp-connect'),
	lr = require('tiny-lr'),
	server = lr();

	// Server - listed on localhost:8080
	gulp.task('webserver', function() {
	connect.server();
	});

	gulp.task('styles', function() {
	return gulp.src('sass/styles.scss')
	.pipe(sass({ style: 'expanded' }))
	.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
	.pipe(gulp.dest('css'))
	.pipe(notify({ message: 'Styles task complete' }));
	});

	// Concatenate & Minify JS
	gulp.task('scripts', function() {
	return gulp.src('js/*.js')
	.pipe(concat('all.js'))
	.pipe(gulp.dest('dist'))
	.pipe(rename('all.min.js'))
	.pipe(uglify())
	.pipe(gulp.dest('dist'));
	});

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

	// Watch
	gulp.task('watch', function() {

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

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

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

	// Create LiveReload server
	var server = livereload();

	// Watch any files in dist/, reload on change
	gulp.watch(['css/','js/','img/*','.html']).on('change', function(file) {
	server.changed(file.path);
	});

	});

	gulp.task('default', ['webserver','styles', 'scripts', 'watch']);
	<!DOCTYPE html>
	<html class="no-js">
	<head>
	<meta charset="utf-8">
	<title>Description here</title>
	<meta name="author" content="Ben Frain - http://benfrain.com">
	<meta name="description" content="Desc">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="css/styles.css">
	<script src="bower_components/modernizr/modernizr.js"></script>
	</head>
	<body>

	<script src="bower_components/jquery/dist/jquery.min.js"></script>
	<script src="js/main.js"></script>
	<script>document.write('<script src="http://' + (location.host \|\| 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
	</body>
	</html>
	{
	"name": "Quick-setup",
	"description": "Basic Gulp niceties for rapidly building stuff",
	"version": "0.0.2",
	"author": "Ben Frain",
	"private": true,
	"devDependencies": {
	"gulp": "~3.8.0",
	"gulp-autoprefixer": "2.0.0",
	"gulp-cache": "~0.2.4",
	"gulp-concat": "~2.4.2",
	"gulp-connect": "^2.2.0",
	"gulp-imagemin": "~2.0.0",
	"gulp-jshint": "~1.9.0",
	"gulp-livereload": "~2.1.0",
	"gulp-notify": "~2.0.1",
	"gulp-rename": "~1.2.0",
	"gulp-sass": "~1.1.0",
	"gulp-uglify": "~1.0.1",
	"tiny-lr": "0.0.7"
	}
	}