Gulp-uglify "JS Compression"----Gulp Series (four)

This section implements JS compression, before the implementation of compression, the first configuration JS task, set the source directory and output directory.

On the basis of the series (c) code, expand it.

1. Locate Gulp->config.js and configure the source directory (SRC->IMG) and output directory (BUILD->IMG) for JS:

New JS task in 2.gulp->tasks, such as:

3. Add the JS task to the default task sequence:

Gulp.task (' Default ', [' less ', ' images ', ' js ', ' Watch ']);

4. Finally add a listen to the Src->js folder in Watch:

Watch (CONFIG.JS.SRC, function () {  //listen to all JS        gulp.start (' js ');             });

At this point, the image under run Gulp,src->js file will be output to Build->js, and the src->js changes will be monitored.

(Note, delete a JS, although it will be monitored, but the build->js will not be deleted, then the series will add another task to solve the problem, here also temporarily do not do)

After the above, our JS Basic task is set up, now add JS compression task:

1. Install the module:

NPM Install--save-dev gulp-uglify

2. Compression tasks:

can be inserted directly in the JS task, but we do not do so, only need to compress when the project is deployed,

We are using the Deploy task to set the JS task to be executed when the project is released.

In the tasks, modify the Deploy.js code as follows:

var gulp = require (' gulp '); Gulp.task (' Deploy ', [' less ', ' uglify ', ' imagemin ']);

3. Finally create a new uglify.js in the Tasks folder:

var uglify = require (' gulp-uglify '); var gulp = require (' Gulp '); var config = require ('.. /config '). Js;gulp.task (function() {    return  gulp.src (CONFIG.SRC)        . Pipe (Uglify ())        . Pipe (Gulp.dest (Config.dest));});

Compared to the JS task, just a more compression method--pipe (Uglify ());

After saving, run Gulp deploy in the named row

The compression is executed successfully.

Look at the official documents in that sentence too.

>>> GitHub Address, please select uglify Branch <<<

Gulp-uglify "JS Compression"----Gulp Series (four)