Gulp JS Minify Plugin

In this tutorial we will learn, how to uglify js files using gulp task.

Installing Gulp Plugin :

Using below command, we can install gulp-uglify, gulp-concat plugin.

npm install --save-dev gulp-uglify
npm install --save-dev gulp-concat

Add Dependency and Create Task

After installing above plugin we need to add dependencies in the configuration file and create task for optimizing js files -

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

gulp.task('js', function(){
   gulp.src('src/scripts/*.js')
   .pipe(concat('script.js'))
   .pipe(uglify())
   .pipe(gulp.dest('build/scripts/'));
});

Now run below gulp task to optimize JavaScript -

gulp js

It will produce below output -

F:\wamp\www\gulp>gulp
[08:57:29] Using gulpfile F:\wamp\www\gulp\gulpfile.js
[08:57:29] Starting 'js'...
[08:57:29] Finished 'js' after 1.05 ms