jonschlinkert / gulp-htmlmin

Minify HTML
https://github.com/jonschlinkert
MIT License
727 stars 58 forks source link

keepClosingSlash option does not work #43

Closed Petitt88 closed 8 years ago

Petitt88 commented 8 years ago

I have the following input:

<input [id]="id"
    [name]="name"
    [ngClass]="class"
    [ngFormControl]="control"
    [placeholder]="placeholder"
    type="text"
    (blur)="onBlur(datepicker.value)"  />

And I get this output:

<input [id]="id" [name]="name" [ngclass]="class" [ngformcontrol]="control" [placeholder]="placeholder" type="text" (blur)="onBlur(datepicker.value)">

The trailing slash is gone and the produced output is not xhtml valid. This is a problem when using angular2 since it cannot parse the template.

This is the options object that I use:

{
            collapseWhitespace: 
            customAttrAssign: [/\)?\]?=/],
            customAttrSurround: [[/#/, /(?:)/], [/\*/, /(?:)/], [/\[?\(?/, /(?:)/]],
            removeComments: true,
            removeTagWhitespace: true,
            keepClosingSlash: true
}
doowb commented 8 years ago

This is probably a bug in html-minifier since the option is passed through.

Petitt88 commented 8 years ago

I'm not sure, I've tried using the html-minifier and it worked. Used the same config object.

Had the two output generated compared and the only difference was this backslash of the <input>.

doowb commented 8 years ago

Seems to be working fine for me:

partials/input.html

<input [id]="id"
    [name]="name"
    [ngClass]="class"
    [ngFormControl]="control"
    [placeholder]="placeholder"
    type="text"
    (blur)="onBlur(datepicker.value)"  />

gulpfile.js

var gulp = require('gulp');
var htmlmin = require('gulp-htmlmin');

gulp.task('default', function () {
  return gulp.src(['partials/input.html'])
    .pipe(htmlmin({
      collapseWhitespace: true,
      customAttrAssign: [/\)?\]?=/],
      customAttrSurround: [[/#/, /(?:)/], [/\*/, /(?:)/], [/\[?\(?/, /(?:)/]],
      removeComments: true,
      removeTagWhitespace: true,
      keepClosingSlash: true
    }))
    .on('error', console.error)
    .on('data', function(file) {
      console.log();
      console.log(file.contents.toString());
      console.log();
    });
});

output

image

Did you install the latest gulp-htmlmin? At first I was having a different issue with the formatting but it was because I was using an older version. Once I updated, everything seems fine. There might be something else in your configuration interfering with it being rendered properly.

Petitt88 commented 8 years ago

Yes you're right, lastest version of gulp-html solved this issue too. Thanks!

rshah88 commented 8 years ago

"keepClosingSlash" option seems to not work in ver 2.0.0. Closing slash for my script tag is removed causing mangling with html code. .pipe(htmlmin({collapseWhitespace: true, keepClosingSlash: true}))