An example of a long gulpfile
var gulp = require('gulp'); | |
var util = require('gulp-util'); | |
var browserSync = require('browser-sync').create(); | |
var sourcemaps = require('gulp-sourcemaps'); | |
var rename = require('gulp-rename'); | |
var sass = require('gulp-sass'); | |
var minifyCss = require('gulp-minify-css'); | |
var browserify = require('gulp-browserify'); | |
var reactify = require('reactify'); | |
var jshint = require('gulp-jshint'); | |
var uglify = require('gulp-uglify'); | |
var spritesmith = require('gulp.spritesmith'); | |
var merge = require('merge-stream'); | |
var paths = { | |
scss: { | |
source: 'resources/scss/**/*.scss', | |
dest: 'assets/css' | |
}, | |
js: { | |
source: 'app/index.js', | |
watch: 'app/**/*.js', | |
dest: 'assets/js' | |
} | |
}; | |
gulp.task('default', ['scss', 'js']); | |
gulp.task('watch', function() { | |
gulp.watch(paths.scss.source, ['scss']); | |
gulp.watch(paths.js.watch, ['js']); | |
browserSync.init({ | |
open: false, | |
server: { | |
baseDir: "./" | |
} | |
}); | |
}); | |
gulp.task('scss', function() { | |
return gulp.src(paths.scss.source) | |
.pipe(!util.env.production ? sourcemaps.init() : util.noop()) | |
.pipe(sass()) | |
.pipe(!util.env.production ? sourcemaps.write() : util.noop()) | |
.pipe(util.env.production ? minifyCss() : util.noop()) | |
.pipe(rename('style.css')) | |
.pipe(gulp.dest(paths.scss.dest)) | |
.pipe(browserSync.reload({ | |
stream: true | |
})); | |
}); | |
gulp.task('js', function() { | |
return gulp.src(paths.js.source) | |
.pipe(!util.env.production ? sourcemaps.init() : util.noop()) | |
.pipe(jshint()) | |
.pipe(jshint.reporter('default')) | |
.pipe(browserify({ | |
transform: ['reactify'], | |
insertGlobals : true, | |
debug : !util.env.production | |
})) | |
.pipe(uglify()) | |
.pipe(!util.env.production ? sourcemaps.write() : util.noop()) | |
.pipe(rename('script.js')) | |
.pipe(gulp.dest(paths.js.dest)) | |
.pipe(browserSync.reload({ | |
stream: true | |
})); | |
}); | |
gulp.task('sprite', function() { | |
var spriteData = gulp.src('resources/img/flags').pipe(spritesmith({ | |
imgName: 'flags.png', | |
imgPath: 'img', | |
cssName: 'temp.css', | |
cssOpts: { | |
cssSelector: function(item) { | |
return '.flag.flag-' + item.name; | |
} | |
} | |
})); | |
var imgStream = spriteData.img | |
.pipe(gulp.dest('assets/img')); | |
var cssStream = spriteData.css | |
.pipe(rename('flags.css')) | |
.pipe(gulp.dest('assets/css')); | |
return merge(imgStream, cssStream); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment