• Stars
    star
    32,856
  • Rank 467 (Top 0.01 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 10 years ago
  • Updated about 2 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A toolkit to automate & enhance your workflow

The streaming build system

NPM version Downloads Azure Pipelines Build Status Build Status AppVeyor 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 3000 curated plugins for streaming file transformations.
  • Simple - By providing only a minimal API surface, gulp is easy to learn and simple to use.

What's new in 4.0?!

  • The task system was rewritten from the ground-up, allowing task composition using series() and parallel() methods.
  • The watcher was updated, now using chokidar (no more need for gulp-watch!), with feature parity to our task system.
  • First-class support was added for incremental builds using lastRun().
  • A symlink() method was exposed to create symlinks instead of copying files.
  • Built-in support for sourcemaps was added - the gulp-sourcemaps plugin is no longer necessary!
  • Task registration of exported functions - using node or ES exports - is now recommended.
  • Custom registries were designed, allowing for shared tasks or augmented functionality.
  • Stream implementations were improved, allowing for better conditional and phased builds.

gulp for enterprise

Available as part of the Tidelift Subscription

The maintainers of gulp and thousands of other packages are working with Tidelift to deliver commercial support and maintenance for the open source dependencies you use to build your applications. Save time, reduce risk, and improve code health, while paying the maintainers of the exact dependencies you use. Learn more.

Installation

Follow our Quick Start guide.

Roadmap

Find out about all our work-in-progress and outstanding issues at https://github.com/orgs/gulpjs/projects.

Documentation

Check out the Getting Started guide and API docs on our website!

Excuse our dust! All other docs will be behind until we get everything updated. Please open an issue if something isn't working.

Sample gulpfile.js

This file will give you a taste of what gulp does.

var gulp = require('gulp');
var less = require('gulp-less');
var babel = require('gulp-babel');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var cleanCSS = require('gulp-clean-css');
var del = require('del');

var paths = {
  styles: {
    src: 'src/styles/**/*.less',
    dest: 'assets/styles/'
  },
  scripts: {
    src: 'src/scripts/**/*.js',
    dest: 'assets/scripts/'
  }
};

/* Not all tasks need to use streams, a gulpfile is just another node program
 * and you can use all packages available on npm, but it must return either a
 * Promise, a Stream or take a callback and call it
 */
function clean() {
  // You can use multiple globbing patterns as you would with `gulp.src`,
  // for example if you are using del 2.0 or above, return its promise
  return del([ 'assets' ]);
}

/*
 * Define our tasks using plain functions
 */
function styles() {
  return gulp.src(paths.styles.src)
    .pipe(less())
    .pipe(cleanCSS())
    // pass in options to the stream
    .pipe(rename({
      basename: 'main',
      suffix: '.min'
    }))
    .pipe(gulp.dest(paths.styles.dest));
}

function scripts() {
  return gulp.src(paths.scripts.src, { sourcemaps: true })
    .pipe(babel())
    .pipe(uglify())
    .pipe(concat('main.min.js'))
    .pipe(gulp.dest(paths.scripts.dest));
}

function watch() {
  gulp.watch(paths.scripts.src, scripts);
  gulp.watch(paths.styles.src, styles);
}

/*
 * Specify if tasks run in series or parallel using `gulp.series` and `gulp.parallel`
 */
var build = gulp.series(clean, gulp.parallel(styles, scripts));

/*
 * You can use CommonJS `exports` module notation to declare tasks
 */
exports.clean = clean;
exports.styles = styles;
exports.scripts = scripts;
exports.watch = watch;
exports.build = build;
/*
 * Define default task that can be called by just running `gulp` from cli
 */
exports.default = build;

Use latest JavaScript version in your gulpfile

Most new versions of node support most features that Babel provides, except the import/export syntax. When only that syntax is desired, rename to gulpfile.esm.js, install the esm module, and skip the Babel portion below.

Node already supports a lot of ES2015+ features, but to avoid compatibility problems we suggest to install Babel and rename your gulpfile.js to gulpfile.babel.js.

npm install --save-dev @babel/register @babel/core @babel/preset-env

Then create a .babelrc file with the preset configuration.

{
  "presets": [ "@babel/preset-env" ]
}

And here's the same sample from above written in ES2015+.

import gulp from 'gulp';
import less from 'gulp-less';
import babel from 'gulp-babel';
import concat from 'gulp-concat';
import uglify from 'gulp-uglify';
import rename from 'gulp-rename';
import cleanCSS from 'gulp-clean-css';
import del from 'del';

const paths = {
  styles: {
    src: 'src/styles/**/*.less',
    dest: 'assets/styles/'
  },
  scripts: {
    src: 'src/scripts/**/*.js',
    dest: 'assets/scripts/'
  }
};

/*
 * For small tasks you can export arrow functions
 */
export const clean = () => del([ 'assets' ]);

/*
 * You can also declare named functions and export them as tasks
 */
export function styles() {
  return gulp.src(paths.styles.src)
    .pipe(less())
    .pipe(cleanCSS())
    // pass in options to the stream
    .pipe(rename({
      basename: 'main',
      suffix: '.min'
    }))
    .pipe(gulp.dest(paths.styles.dest));
}

export function scripts() {
  return gulp.src(paths.scripts.src, { sourcemaps: true })
    .pipe(babel())
    .pipe(uglify())
    .pipe(concat('main.min.js'))
    .pipe(gulp.dest(paths.scripts.dest));
}

 /*
  * You could even use `export as` to rename exported tasks
  */
function watchFiles() {
  gulp.watch(paths.scripts.src, scripts);
  gulp.watch(paths.styles.src, styles);
}
export { watchFiles as watch };

const build = gulp.series(clean, gulp.parallel(styles, scripts));
/*
 * Export a default task
 */
export default build;

Incremental Builds

You can filter out unchanged files between runs of a task using the gulp.src function's since option and gulp.lastRun:

const paths = {
  ...
  images: {
    src: 'src/images/**/*.{jpg,jpeg,png}',
    dest: 'build/img/'
  }
}

function images() {
  return gulp.src(paths.images.src, {since: gulp.lastRun(images)})
    .pipe(imagemin())
    .pipe(gulp.dest(paths.images.dest));
}

function watch() {
  gulp.watch(paths.images.src, 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.

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

More Repositories

1

vinyl

Virtual file format.
JavaScript
1,261
star
2

vinyl-fs

Vinyl adapter for the file system.
JavaScript
963
star
3

liftoff

Launch your command line tool with ease.
JavaScript
836
star
4

gulp-util

[deprecated] - See https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5
JavaScript
830
star
5

gulp-cli

Command Line Interface for gulp.
JavaScript
392
star
6

plugins

[Unused] Very old plugin search website
JavaScript
280
star
7

interpret

A dictionary of file extensions and associated module loaders.
JavaScript
254
star
8

undertaker

Task registry that allows composition through series/parallel methods.
JavaScript
194
star
9

glob-stream

Readable streamx interface over anymatch.
JavaScript
178
star
10

bach

Compose your async functions with elegance.
JavaScript
132
star
11

fancy-log

Log things, prefixed with a timestamp.
JavaScript
119
star
12

findup-sync

Find the first file matching a given pattern in the current directory or the nearest ancestor directory.
JavaScript
97
star
13

glob-watcher

Watch globs and execute a function upon change, with intelligent defaults for debouncing and queueing.
JavaScript
79
star
14

glob-parent

Extract the non-magic parent path from a glob string.
JavaScript
76
star
15

async-done

Allows libraries to handle various caller provided asynchronous functions uniformly. Maps promises, observables, child processes and streams, and callbacks to callback style.
JavaScript
69
star
16

v8flags

Get available v8 and Node.js flags.
JavaScript
56
star
17

gulplog

Logger for gulp and gulp plugins
JavaScript
56
star
18

rechoir

Prepare a node environment to require files with different extensions.
JavaScript
47
star
19

replace-ext

Replaces a file extension with another one.
JavaScript
46
star
20

gulpjs.github.io

The gulp website
JavaScript
45
star
21

ordered-read-streams

Combines array of streams into one Readable stream in strict order.
JavaScript
28
star
22

now-and-later

Map over an array or object of values in parallel or series, passing each through the async iterator, with optional lifecycle hooks.
JavaScript
24
star
23

hacker

Hack on your project easily. A liftoff proof-of-concept.
JavaScript
23
star
24

flagged-respawn

A tool for respawning node binaries when special flags are present.
JavaScript
21
star
25

artwork

Artwork for the gulp project
21
star
26

plugin-error

Error handling for vinyl plugins. Just an abstraction of what's in gulp-util with minor reformatting.
JavaScript
21
star
27

empty-dir

Check if a directory is empty.
JavaScript
20
star
28

sparkles

Namespaced global event emitter
JavaScript
20
star
29

acceptance

Acceptance test suite for plugins
19
star
30

undertaker-forward-reference

Undertaker custom registry supporting forward referenced tasks.
JavaScript
19
star
31

glogg

Global logging utility.
JavaScript
18
star
32

lead

Sink your streams.
JavaScript
17
star
33

undertaker-registry

Default registry in gulp 4.
JavaScript
17
star
34

vinyl-sourcemap

Add/write sourcemaps to/from Vinyl files.
JavaScript
15
star
35

last-run

Capture and retrieve the last time a function was run
JavaScript
14
star
36

path-dirname

Node.js path.dirname() ponyfill
JavaScript
13
star
37

fined

Find a file given a declaration of locations.
JavaScript
12
star
38

async-settle

Settle an async function. It will always complete successfully with an object of the resulting state.
JavaScript
11
star
39

value-or-function

Normalize a value or function, applying extra args to the function
JavaScript
11
star
40

copy-props

Copy properties deeply between two objects
JavaScript
10
star
41

to-through

Wrap a Readable stream in a Transform stream.
JavaScript
10
star
42

semver-greatest-satisfied-range

Find the greatest satisfied semver range from an array of ranges.
JavaScript
9
star
43

mute-stdout

Mute and unmute stdout
JavaScript
9
star
44

resolve-options

Resolve an options object based on configuration.
JavaScript
9
star
45

has-gulplog

Check if gulplog is available before attempting to use it
JavaScript
9
star
46

clone-buffer

Easier Buffer cloning in node.
JavaScript
9
star
47

eslint-config-gulp

Sharable eslint config for gulp projects
JavaScript
8
star
48

async-once

Guarantee a node-style async function is only executed once.
JavaScript
8
star
49

fs-mkdirp-stream

Ensure directories exist before writing to them.
JavaScript
8
star
50

undertaker-common-tasks

Proof-of-concept custom registry that pre-defines tasks.
JavaScript
7
star
51

remove-bom-stream

Remove a UTF8 BOM at the start of the stream.
JavaScript
7
star
52

registry

[Unused] NPM on ElasticSearch
JavaScript
5
star
53

better-stats

A replacement for node's fs.Stats with more utility
JavaScript
5
star
54

theming-log

Creates a logger with theme for text decoration.
JavaScript
4
star
55

undertaker-task-metadata

Proof-of-concept custom registry that attaches metadata to each task.
JavaScript
4
star
56

vinyl-contents

Utility to read the contents of a vinyl file.
JavaScript
4
star
57

replace-homedir

Replace user home in a string with another string. Useful for tildifying a path.
JavaScript
4
star
58

each-props

Process object properties deeply.
JavaScript
3
star
59

evented-require

Require modules and receive events.
JavaScript
3
star
60

.github

GitHub template files for the gulpjs organization.
3
star
61

update-template

Updates a gulpjs repository to match our current scaffold.
JavaScript
3
star
62

vinyl-prepare

[deprecated] This module's API was never satisfactory and isn't used in gulp - please don't use.
JavaScript
3
star
63

.boilerplate

The boilerplate template for gulp packages.
3
star
64

parse-node-version

Turn node's process.version into something useful.
JavaScript
2
star
65

default-resolution

Get the default resolution time based on the current node version, optionally overridable
JavaScript
2
star
66

jscs-preset-gulp

Sharable jscs config for gulp projects
2
star
67

conventional-changelog-gulp

conventional-changelog gulp preset
JavaScript
1
star
68

emit-mapper

Re-emit events while mapping them to new names.
JavaScript
1
star