Gulp First Impressions

A few months ago, San Mujun recommended to me gulp, to now because the work needs to touch it, really ashamed, in this record of the first impression of Gulp.

Global Installation:

$ NPM Install–global Gulp

A gulpfile.js file:

This file needs to be created in the root directory of the project. Default task (Do Nothing):

1. var gulp = require(' Gulp ');
2. Gulp. Task(' default ', function() {
3. Place code for your the default task here
4. });

The following command will perform this task:

$gulp

Look at Gulp's api!.

It is divided into four large parts:

• GULP.SRC: Defines the source files to be manipulated (available * To specify directories, file types)

• Gulp.task: Defining tasks such as compression, optimization, compilation, and so on

• Gulp.dest: Files generated when the specified directory is written (after the task is executed)

• Gulp.watch: When a file is modified, a task is executed

* Simply put: which files (src)? What is the operation (Task)? Where are the results written, and how are they written (dest)? Then, to make it easy for us to focus on coding, let watch automatically monitor all changes.

As an example:

Create a task that listens for all files of type less and executes less-pro when any of the less files are modified. *

1. Gulp. Task(' watch-less ', function () {
2. Gulp. Watch(' less/*.less ', [' Less-pro ']);
3. });

The Less-pro task fragment is as follows:

1. Gulp. Task(' watch-less ', function () {
2. Gulp. Watch(' less/*.less ', [' Less-pro ']);
3. });

As in the example of watch less, execute:

$ Gulp Watch-less

You can automatically monitor changes to all less files and compile them.

Full text link: http://www.gbtags.com/gb/share/5697.htm

Gulp First Impressions