BBaysinger
BBaysinger

Reputation: 6987

How to reduce HTML to a single line with no whitespace via Gulp

I'm trying to minify HTML with Gulp to remove all line breaks and white space so the entire code content resides on one line only and with no redundant whitespace like tabs and spaces, including in embedded JavaScript and CSS.

I've tried gulp-minify, but I do not see the output or compression options for that, which leaves me cross-eyed. I thought that was one of the common functions of minification. This beautifier/minifier does precisely what I need via its minify button, but I need that functionality via Gulp.

Ok I'm going insane. Thanks in advance.

Upvotes: 0

Views: 1322

Answers (1)

Mark
Mark

Reputation: 180657

const gulp = require("gulp");
const minHTML = require('gulp-htmlmin');

gulp.task("htmlMin", function () {
  return (
    gulp
      .src("./*.html")
      .pipe(minHTML({ collapseWhitespace: true }))
      .pipe(gulp.dest("dist"))
  );
});

exports.default = gulp.series("htmlMin");

And run it with just gulp at the command line.

Using gulp-htmlmin as suggested by @Cully in the comments, and I already had.

  ~/replace ==>  gulp
[01:23:36] Using gulpfile ~\OneDrive\Test Bed\replace\gulpfile.js
[01:23:36] Starting 'default'...
[01:23:36] Starting 'htmlMin'...
[01:23:36] Finished 'htmlMin' after 127 ms
[01:23:36] Finished 'default' after 132 ms

Upvotes: 1

Related Questions