Question

我使用Gulp，webpack和pug（jade）。问题在于dist代码由于构建时的格式化而具有额外的空间。

伪码：

label
  each item in items
    span
      if kkk == 2
        =item[1]
      else
        abbr(title='ttttttt')
          =elem

和结果（dist）.html是这样的：

<label for="ааааа">set to 
    <abbr title="Scalable Vector Graphics">SVG/</abbr>
    <abbr title="Joint Photographic Experts Group">JPEG</abbr>
</label>

看起来像：

设置为SVG / JPEG

如何删除'/'后的空格，或更改某些内容使其看起来像：

设置为SVG / JPEG

这是我的代码：

+mixin dd['svg', 'sdf sdfsdsd SVG', , , , [['Scalable Vector Graphics', 3]]],

mixin dd(list)
- var words = [];
- var abbr = [];
each item, i in list
//-....
    - var words = [];
    - var abbr = [];
    +e.INPUT(id= it[0])
    +e.LABEL(for=it[0])
        - words = item[1].match(/[^\s\/]+\/?/g)
        each elem, i in words
            if it[3] != undefined && it[3].indexOf(i + 1) != -1
                +e.SPAN
                    +other(it[5], abbr, i, words.length, elem)
            else
                +other(it[5], abbr, i, words.length, elem)

mixin other(abbrs, abbr, i, wordslength, elem)
    if abbrs != undefined && abbrs.some(elem => (abbr = elem)[1] == (i + 1))
        abbr(title= abbr[0])
            =elem
        else
            =elem

换句话说，需要制作

<abbr title="Scalable Vector Graphics">SVG/</abbr>
<abbr title="Joint Photographic Experts Group">JPEG</abbr>

生成的构建（dist）代码中的一行：

<abbr title="Scalable Vector Graphics">SVG/</abbr><abbr title="Joint Photographic Experts Group">JPEG</abbr>

display：inline-block;一无所获。检查了其他几个类似的问题 - 与此问题无关。

Answer 1

我担心这个人没有优雅的方式。

如果您想要快速解决方案，我建议setting the font size of the parent element to 0。

如果你想从Pug的角度解决它，也许尝试在Pug（{ pretty: false }）中禁用美化HTML输出？不确定它是否会在这种情况下修复它，但它可能（但结果HTML不再相当）。

在gulp构建的格式化标签之间添加了Pug（Jade）额外空间

1 个答案: