gulp-html-minifier

Minify HTML with html-minifier.

gulp-html-minifier

Minifies HTML using the html-minifier module. See html-minifer

Getting Started

Install the module with:

npm install gulp-html-minifier

Along with the default options for html-minifier gulp-html-minifier exposes two additional handy methods. You can ignore paths within the filepath preventing the need to pipe in a rename. This is similar to what gulp-inject does.

Also you can pass in the environment to simply output your html to the destination ignoring the above paths if any but minification is not applied. This is helpful and probably what you want in the development process.

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

Ignore Path

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

Development Mode

If you pass into your options minification is skipped however ignore path will still be applied. This makes viewing source and element inspection easier as you probably don't want minified html when you're developing your application.