javascript – 如何使用带有下划线模板的HTML minifier

我有一些模板用于我的前端代码,例如：

<div class="row">
    <div class="my-header col-md-1">
        <!-- comments -->
        {{ title }}
    </div>
    <div class="my-container col-md-11">
    {% if (content) { %}
        {{ content }}
    {% } else { %}
       <p>Empty</p> 
    {% } %}
    </div>
</div>

我正在使用grunt-contrib-jst将它们全部存储在一个文件中,然后在另一个构建步骤中将包含在单个JS文件中,并将该文件推送到CDN.这部分工作正常,但我想使用processContent选项来缩小HTML模板代码,其中包含Undercore模板分隔符(<％...％>替换为{％…％},<％= ...％>替换为{{…}}).

我想使用html-minifier,但它实际上并没有最小化任何东西,显然是因为它试图将模板解析为仅HTML(并且由于模板标记而失败).

是否有任何Node包/函数可以让我最小化这种模板？我想在源模板中使用注释和空格,但在生成的构建文件中删除所有不必要的内容.

现在我在JST设置上有这个：

processContent: function (content) {
    return content
        .replace(/^[\x20\t]+/mg,'')
        .replace(/[\x20\t]+$/mg,'')
        .replace(/^[\r\n]+/,'')
        .replace(/[\r\n]*$/,'\n');
},...

但我想尽量减少一切可能,这就是我尝试html-minifier的原因.

谢谢！

解决方法

我无法真正帮助最小化下划线模板分隔符,仍然试图找到自己做到这一点的最佳方法,但你可能想要考虑通过 htmlclean运行模板.我将它用于r.js并且它工作得很好用于删除代码中的换行符和空格.用法示例：

var htmlclean = require('htmlclean');

// ...
processContent: function (content) {
    return htmlclean(content)
        .replace(/^[\x20\t]+/mg,

我在使用下划线模板的HTML上使用它没有任何问题.我希望它对你有所帮助.