Gulp HTML Minify Plugin

In this tutorial we will learn, how to minify html files using gulp task.

Installing Gulp Plugin :

Using below command, we can install gulp-htmlmin plugin.

npm install --save-dev gulp-htmlmin

Add Dependency and Create Task

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

var gulp = require('gulp');
var minify = require('gulp-htmlmin');
gulp.task('minify', function() {
  return gulp.src('src/**/*.html')
    .pipe(htmlmin({collapseWhitespace: true}))
    .pipe(gulp.dest('build'));
});

Now run below gulp task to minify html files -

gulp minify

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 'minify'...
[08:57:29] Finished 'minify' after 1.05 ms