0

我在 Gruntfile.js htmlmin 部分中minifyCSS设置为true ，如下所示：

htmlmin: {
    dist: {
        options: {
            removeComments: true,
            collapseWhitespace: true,
            minifyJS: true,
            minifyCSS: true
...

但不幸的是，它现在正在修改我的一些 Handlebars 代码，将其变为：

<style type="text/css">
{{#each list}}
  .aClassWithBgImage{{@index}}{background-image:url({{images.thumbnailBoxImage}})}
{{/each}}
</style>

进入这个：

<style type="text/css">{background-image:url({{images.thumbnailBoxImage}})}</style>

...当我真正想要的（期待）是这样的：

<style type="text/css">{{#each list}}.aClassWithBgImage{{@index}}{background-image:url({{images.thumbnailBoxImage}})}{{/each}}</style>

对此有任何快速修复吗？否则，我确定我可以以不同的方式重组我的代码

4

1 回答 1

0

在此答案的帮助下，我发现html-minifier 文档ignoreCustomFragments中有一个选项。使用它，您可以告诉 htmlmin 跳过尝试压缩标签，使用如下代码：{{}}Gruntfile.js

htmlmin: {
    ...
        options: {
            ignoreCustomFragments: [/<%[\s\S]*?%>/, /<\?[\s\S]*?\?>/, /{{[\s\S]*?}}/], //last item in array is the one for Handlebars. The previous 2 items are the default code tags to be ignored, listed in the documentation
            ...

所以关键部分是添加正则/{{[\s\S]*?}}/表达式。（当然，如果你愿意，你可以用那个 RegEx 替换整个ignoreCustomFragments数组。） 注意：你可能想在 RegEx 中转义大括号“{}”，但没有它似乎也能正常工作。

更新

所以实际上，/{{[\s\S]*?}}/RegEx 似乎在我的代码中留下了一个空格“”......如果我将它更改为/{{.*}}/，空格被删除，但我的一些 CSS 样式变得未压缩......所以现在，我考虑这两个 RegEx有点“半解决方案”。我也尝试使用customAttrSurround Wiki 中列出的方法，但我什至无法让该代码在我的 Gruntfile.js 中运行。

于 2016-04-13T12:46:10.973 回答