Skip to content

Instantly share code, notes, and snippets.

@rascode
Created February 16, 2014 14:11
Show Gist options
  • Save rascode/9034781 to your computer and use it in GitHub Desktop.
Save rascode/9034781 to your computer and use it in GitHub Desktop.
Sample Gulp Configuration
//declare gulp variables
var gulp = require('gulp'),
gulpUtil = require('gulp-util'),
concat = require('gulp-concat'),
uglify = require('gulp-uglify'),
jshint = require('gulp-jshint'),
stylish = require('jshint-stylish'),
autoprefixer = require("gulp-autoprefixer"),
sass = require('gulp-ruby-sass'),
imagemin = require('gulp-imagemin'),
notify = require("gulp-notify"),
browserSync = require('browser-sync');
watch = require('gulp-watch');
//declare paths to be used for concatonated files
var paths = {
scss: ['./assets/stylesheets/scss/*.scss'],
css: ['./app/css/*.css'],
scripts: ['./assets/scripts/js/*.js'],
images: './assets/images/*',
html: './app/*.html'
};
//lint javascript
gulp.task('lint', function(){
gulp.src( paths.scripts )
.pipe(jshint())
.pipe(jshint.reporter(stylish))
});
//minify and concatonate javascript
gulp.task('scripts', function(){
gulp.src( paths.scripts )
.pipe(concat('script.min.js'))
.pipe(uglify())
.pipe(gulp.dest('./app/scripts'))
});
//minify and concatonate sass files
gulp.task('sass', function () {
gulp.src(paths.scss)
.pipe(sass({sourcemap: true, style:"nested"}))
.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 9', 'ie 8', 'opera 12.1', 'ios 6', 'android 4'))
.pipe(gulp.dest('./app/css'))
});
// optimize all static images and move to a 'min' directory
gulp.task('images', function() {
gulp.src(paths.images)
.pipe(imagemin({optimizationLevel: 5}))
.pipe(gulp.dest('./app/images'))
});
//declare the source for the html files
gulp.task('html', function(){
gulp.src(paths.html)
});
gulp.task('browser-sync', function() {
browserSync.init([paths.html, paths.css], { // files to inject
server: {
baseDir: "app"
}
});
});
// Rerun the task when a file changes
gulp.task('watch', function () {
gulp.watch( paths.stylesheets, ['sass']);
gulp.watch( paths.scripts, ['scripts']);
gulp.watch( paths.images, ['images']);
gulp.watch( paths.html, ['html']);
});
// development tasks
gulp.task('dev', ['lint','scripts','sass','browser-sync','watch']);
// build tasks
gulp.task('build', ['scripts','sass','images']);
// default task (called when you run `gulp` from cli)
gulp.task('default', ['dev']);
{
"name": "",
"version": "0.0.1",
"author": "",
"homepage": "",
"repository": {
"type": "git",
"url": ""
},
"devDependencies": {
"gulp": "~3.5.2",
"gulp-util": "~2.2.14",
"gulp-concat": "~2.1.7",
"gulp-uglify": "~0.2.1",
"gulp-watch": "~0.5.0",
"gulp-imagemin": "~0.1.5",
"gulp-ruby-sass": "~0.3.0",
"gulp-jshint": "~1.4.2",
"gulp-markdown": "~0.1.2",
"gulp-notify": "~0.5.0",
"jshint-stylish": "~0.1.5",
"gulp-autoprefixer": "0.0.6",
"browser-sync": "~0.5.7"
},
"dependencies": {
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment