如何使用 Gulp.js 从 HTML 中删除注释？答案

【问题标题】：How can I strip comments from HTML with Gulp.js?如何使用 Gulp.js 从 HTML 中删除注释？
【发布时间】：2014-11-06 04:32:27
【问题描述】：

我刚刚开始使用 gulp.js，我想知道是否有办法从我的 HTML 文件中去除 cmets。当然，我不希望从原始文件中删除 cmets，只希望那些将要投入生产的文件。假设我有一个这样的文件：

index.html // 在 gulp 之前

<html>
    <!-- Some comments -->
    <!-- Some more comments -->
    <div>
        // some stuff
    </div>
</html>

index.html // 在 gulp 之后

<html>
    <div>
        // some stuff
    </div>
</html>

我的部分问题是我不确定这应该如何工作。我是否想将我所有吞咽的 HTML 文件（已删除 cmets）放在一个单独的目录中，并且只将其推送到我的服务器？我仍然希望 cmets 存在于我的测试环境（以及我的 repo）上的 HTML 文件中，而不是用于生产的文件中。任何帮助我理解如何做到这一点将不胜感激！

【问题讨论】：

标签： html gulp

【解决方案1】：

使用gulp-htmlmin，您可以这样做：

.pipe(htmlmin(
  {
    removeComments: true
  }
))

请参阅https://github.com/kangax/html-minifier#options-quick-reference 了解所有可用选项。

【讨论】：

【解决方案2】：

我通常使用gulp-htmlmin 来删除 cmets 以及可以对 html 文件执行的许多其他优化。我有一个 SRC 文件夹，其中包含带有 cmets 的源 html 文件和一个 BUILD 文件夹，其中包含所有优化的资产（js、css 和 html），并且在生产模式下我从 build 文件夹中提供文件。

【讨论】：

【解决方案3】：

使用https://www.npmjs.org/package/gulp-preprocess，您可以删除 cmets。

所以你会有一个文件夹 - 如上所述 - 用于 pre gulp 文件和一个用于之后的文件。

然后你可以做 2 个不同的任务。一种只复制 html 文件，一种复制它们并删除 cmets。

【讨论】：

【解决方案4】：

也许最简单的方法是使用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'));
});

【讨论】：