Skip to content

gulpjs/gulp

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

The streaming build system

NPM version Downloads Build Status Coveralls Status OpenCollective Backers OpenCollective Sponsors Gitter chat

What is gulp?

  • Automation - gulp is a toolkit that helps you automate painful or time-consuming tasks in your development workflow.
  • Platform-agnostic - Integrations are built into all major IDEs and people are using gulp with PHP, .NET, Node.js, Java, and other platforms.
  • Strong Ecosystem - Use npm modules to do anything you want + over 2000 curated plugins for streaming file transformations
  • Simple - By providing only a minimal API surface, gulp is easy to learn and simple to use

Documentation

For a Getting started guide, API docs, recipes, making a plugin, etc. check out our docs!

Sample gulpfile.js

This file will 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/**/*'
};

// Not all tasks need to use streams
// A gulpfile is just another node program and you can use any package available on npm
gulp.task('clean', function() {
  // You can use multiple globbing patterns as you would with `gulp.src`
  return del(['build']);
});

gulp.task('scripts', function() {
  // Minify and copy all JavaScript (except vendor scripts)
  // with sourcemaps all the way down
  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'));
});

// Copy all static images
gulp.task('images', function() {
  return gulp.src(paths.images)
    // Pass in options to the task
    .pipe(imagemin({optimizationLevel: 5}))
    .pipe(gulp.dest('build/img'));
});

// Rerun the task when a file changes
gulp.task('watch', function() {
  gulp.watch(paths.scripts, 'scripts');
  gulp.watch(paths.images, 'images');
});

gulp.task('all', gulp.parallel('watch', 'scripts', 'images'));
// The default task (called when you run `gulp` from cli)
gulp.task('default', gulp.series('clean', 'all'));

Incremental Builds

We recommend these plugins:

  • gulp-changed - only pass through changed files
  • gulp-cached - in-memory file cache, not for operation on sets of files
  • gulp-remember - pairs nicely with gulp-cached
  • gulp-newer - pass through newer source files only, supports many:1 source:dest

Want to test the latest and greatest?

We're hard at work on our latest release, but we need your help testing it!

npm install gulpjs/gulp#4.0

There's a slew of major (wonderful) changes in 4.0, so make sure you check out the docs on that branch!

Want to contribute?

Anyone can help make this project better - check out our Contributing guide!

Backers

Support us with a monthly donation and help us continue our activities.

Backers

Sponsors

Become a sponsor to get your logo on our README on Github.

Sponsors