Simple and lightweight cleaner that just removes whitespaces, comments, etc. to minify HTML/SVG. This differs from others in that this removes whitespaces, line-breaks, etc. as much as possible.
If you want to just clean files, Command Line Tool is easy way.
Simple and lightweight cleaner that just removes whitespaces, comments, etc. to minify HTML/SVG.
This differs from others in that this removes whitespaces, line-breaks, etc. as much as possible.
htmlclean removes the following texts.
- The leading whitespaces, tabs and line-breaks, and the trailing whitespaces, tabs and line-breaks.
- The unneeded whitespaces, tabs and line-breaks between HTML/SVG tags.
- The more than two whitespaces, tabs and line-breaks (suppressed to one space).
- HTML/SVG comments.
The more than two whitespaces (even if those are divided by HTML/SVG tags) in a line are suppressed.
The clean HTML is here.
The clean HTML is here.
The whitespace that was right side of
<strong> was removed, and the left side was kept.
The both side whitespaces of
<em> were removed.
The following texts are protected (excluded from removing).
- The texts in
styleelements, and text nodes in
- The quoted texts in tag attribute.
- The texts in SSI tags (PHP, JSP, ASP/ASP.NET and Apache SSI).
- IE conditional comments. e.g.
<!--[if lt IE 7]>
- The texts between
- The texts that is matched by
protectoption (see "Options").
This plugin requires Grunt
If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:
npm install grunt-htmlclean --save-dev
In your project's Gruntfile, add a section named
htmlclean to the data object passed into
gruntinitConfightmlclean:options:protect: /<\!--%fooTemplate\b.*?%-->/greturn htmlreplace/\begg\b/ig 'omelet$1';deploy:expand: truecwd: 'develop/'src: '**/*.html'dest: 'public_html/';
See htmlclean for options and more information.
For example, you want to clean only changed HTML files. Then grunt-task-helper helps it. In this case, using
handlerByContent Function instead of this plugin is better. Because grunt parses
files components in every tasks(targets).
handlerByContent can be included to one task with other handlers (e.g. select changed HTML files).
gruntinitConfigtaskHelper:deploy:options:// Select files which are newer than `dest`.handlerByFile: 'newFile'// Clean the selected files.handlerByContent: require'grunt-htmlclean/node_modules/htmlclean'//handlerByContent: require('htmlclean') // If htmlclean is already installed. (Not grunt-htmlclean)expand: truecwd: 'develop/'src: '**/*.html'dest: 'public_html/';
- 2015-02-22 v2.5.0 Update package.json for htmlclean v2.5.0.
- 2015-02-21 v2.4.0 Update package.json for htmlclean v2.4.0.
- 2015-02-13 v2.3.0 Update package.json for htmlclean v2.3.0.
- 2014-09-16 v2.2.0 Update package.json for htmlclean v2.2.0.
- 2013-08-27 v0.1.0 Initial release.