Gulp: A new generation of front-end building tool

1. What is Gulp

Gulp.js is a next-generation build tool that is stream-based and code-better than configuration.

Gulpand Grunt similar. But compared to Grunt the frequent IO operation of the Gulp flow operation, the build can be completed faster.

2. Gulp characteristics

• Easy to use

The code is better than the configured strategy to Gulp make simple tasks simple and complex tasks more manageable.

• Build Fast

Reduce frequent IO operations and build projects faster with streaming operations.

• High quality plug-in

GulpThere are strict plug-in guidance strategies to ensure that the plug-in can be simple and high-quality work.

• Easy to learn

A small amount of API, mastering Gulp can be effortless. Build is like a flow pipeline, easy to add pleasure.

3, Gulp Installation

Gulpis based on Node.js , so first install node. js

NPM install-g gulpnpm Install--save-dev Gulp

4, Gulp use

Gulp 's tasks are in the form of plug-ins, and this example takes  gulp-jshint  as an example to show the general use of Gulp .

Installing Gulp-jshint

NPM Install Gulp-jshint--save-dev

create Gulpfile.js

The Gulp project page has one Sample gulpfile . If you can not write, direct reference on the OK.

var gulp = require (' gulp '); var jshint = require (' Gulp-jshint '); var paths = {scripts: ' Js/**/*.js ',};gulp.task (' Lint ', Fu Nction () {return gulp.src (paths.scripts). Pipe (Jshint ()). Pipe (Jshint.reporter (' Default '));});

Then execute the command line

Gulp Lint

Can.

5, Gulp Summary

Gulp   compared to   Grunt   There are many advantages, more intuitive: that is, the learning curve is relatively smooth. Faster and less configuration than grunt.

Gulp has many advanced features, see official documentation

Gulp Plugin List

http://gulpjs.com/

Gulp: A new generation of front-end building tool