How do I remove comments from HTML using Gulp.js?
I just started using gulp.js and I want to know if there is a way to strip comments from my HTML files. Of course, I don't want comments to be removed from the original files, only those that will be in production. Let's say I have a file like this:
index.html // before gulp
<html>
<!-- Some comments -->
<!-- Some more comments -->
<div>
// some stuff
</div>
</html>
index.html // after gulp
<html>
<div>
// some stuff
</div>
</html>
Part of my question is that I'm not entirely sure how this is supposed to work. Should I put all my compressed HTML files (with comments removed) in a separate directory and only push this to my server? I still want comments to exist in my HTML files in my test environment (and in my repo), not on files that go to production. Any help on my understanding of how to do this would be greatly appreciated!
source to share
with help gulp-htmlmin
you can do it like this:
.pipe(htmlmin(
{
removeComments: true
}
))
see https://github.com/kangax/html-minifier#options-quick-reference for all available options.
source to share
I usually use gulp-htmlmin to remove comments, among many other optimizations that can be done in html files. I have an SRC folder containing the source html files with comments and a BUILD folder that contains all the optimized resources (js, css and html), and I serve files from the build folder in production.
source to share
From https://www.npmjs.org/package/gulp-preprocess you can remove comments.
So, you will have one folder - as above - for the pre gulp files and one for it.
Then you could accomplish two different tasks. One that only copies html files and copies them and removes comments.
source to share
Perhaps the easiest way is gulp-decomment :
var gulp = require('gulp');
var decomment = require('gulp-decomment');
gulp.task('default', function () {
return gulp.src('input.js')
.pipe(decomment())
.pipe(gulp.dest('dest'));
});
source to share