gulp
The streaming build system
Like what we do?
Support us via Gratipay
Documentation
For a Getting started guide, API docs, recipes, making a plugin, etc. see the documentation page!
Sample gulpfile.js
This file is just a quick sample to give you a taste of what gulp does.
var gulp = require('gulp');
var coffee = require('gulp-coffee');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var imagemin = require('gulp-imagemin');
var sourcemaps = require('gulp-sourcemaps');
var del = require('del');
var paths = {
scripts: ['client/js/**/*.coffee', '!client/external/**/*.coffee'],
images: 'client/img/**/*'
};
gulp.task('build', gulp.series(
clean,
gulp.parallel(scripts, images)
));
gulp.task(clean);
gulp.task(watch);
gulp.task('default', gulp.series('build'));
function clean(done) {
del(['build'], done);
}
function images() {
return gulp.src(paths.images)
.pipe(imagemin({optimizationLevel: 5}))
.pipe(gulp.dest('build/img'));
}
function scripts() {
return gulp.src(paths.scripts)
.pipe(sourcemaps.init())
.pipe(coffee())
.pipe(uglify())
.pipe(concat('all.min.js'))
.pipe(sourcemaps.write())
.pipe(gulp.dest('build/js'));
}
function watch() {
gulp.watch(paths.scripts, scripts);
gulp.watch(paths.images, images);
}
Incremental Builds
You can filter out unchanged files between runs of a task using
the gulp.src
function's since
option and gulp.lastRun
:
function images() {
return gulp.src(paths.images, {since: gulp.lastRun('images')})
.pipe(imagemin({optimizationLevel: 5}))
.pipe(gulp.dest('build/img'));
}
function watch() {
gulp.watch(paths.images, images);
}
Task run times are saved in memory and are lost when gulp exits. It will only
save time during the watch
task when running the images
task
for a second time.
If you want to compare modification time between files instead, we recommend these plugins:
gulp-newer example:
function images() {
var dest = 'build/img';
return gulp.src(paths.images)
.pipe(newer(dest))
.pipe(imagemin({optimizationLevel: 5}))
.pipe(gulp.dest(dest));
}
If you can't simply filter out unchanged files, but need them in a later phase
of the stream, we recommend these plugins:
gulp-remember example:
function scripts() {
return gulp.src(scriptsGlob)
.pipe(cache('scripts'))
.pipe(header('(function () {'))
.pipe(footer('})();'))
.pipe(remember('scripts'))
.pipe(concat('app.js'))
.pipe(gulp.dest('public/'))
}
Want to contribute?
Anyone can help make this project better - check out the Contributing guide!