What is "gulp"

Gulp is a task automated and build in javascript, based on the nodejs. Its function and purpose is similar to that of the Grunt. Gulp uses the concept of streams and a template where tasks are written in code form, providing simplicity and readability, while Grunt needs a high level of configuration to define the same tasks.

Installation

The first step is to install the Gulp CLI globally on the system, using the package manager npm:

$ npm install -g gulp

To check the installation and version of Gulp, just run

$ gulp -v

Initial setup

The project must be started with npm init to create, in an interactive way, the package.json. After that, add the Gulp

$ npm init
$ npm install --save-dev gulp

As tasks must be located in the archive gulpfile.js, which should be created at the root of the project. A gulpfile containing a task default is

var gulp = require('gulp');

gulp.task('default', function(){
    // code
});

And she can be rotated with

$ gulp

Example

A task that minifies files .js in a development folder /src/js/ and places these files in a distribution folder /dist/js can be done using the package gulp uglify. After project startup and local installation of packages

$ npm init
$ npm install --save-dev gulp
$ npm install --save-dev gulp-uglify

to task uglify should be created in the archive gulpfile.js

var gulp = require('gulp'),
    uglify = require('gulp-uglify');

gulp.task('uglify', function(){
    return gulp.src('src/js/*.js')
        .pipe(uglify())
        .pipe(gulp.dest('dist/js'))
});

Done this, just turn

$ gulp uglify

Interesting links