javascript - 如何避免生成的 JavaScript 字符串文字包含用于缩进的空格？

Question

假设我有一个如下所示的 HTML 字符串文字模板:

let tpl = 
  `<div>
        <h1>Hello world</h1>
   </div>`;

一旦编译为 javascript (es5)，它就会变成这样:

var tpl = "<div>\n    <h1>Hello World</h1>\n     </div>

这在生成的代码中占用了不必要的空间。我该怎么做才能使生成的代码像这样:

var tpl = "<div><h1>Hello World</h1></div>";

或者至少:

var tpl = "<div>" + "<h1>Hello World</h1>" + "</div>";

无需在我的 TypeScript 源代码中实际编写此逻辑？

Answer 1

模板字符串保留空格。 您需要编写的字符串开头不包含空格。

var tpl = `<div>
<h1>hello world</h1>
</div>`

更新:如果您愿意，可以使用标记字符串模板:

function trimIndent(strings: TemplateStringsArray) {
  return str[0].split('\n').map(s => s.trim()).join('')
}

var tpl = trimIndent`<div>
  <h1>Hello World</h1>
</div>`

您可以改进函数trimIndent()来满足您的需求。