如何删除 lodash 模板创建的换行符？答案

【问题标题】：How to remove line breaks that lodash templates create?如何删除 lodash 模板创建的换行符？
【发布时间】：2019-01-15 14:15:40
【问题描述】：

我正在从 lodash 模板（使用 webpack）渲染 HTML，但 lodash 模板正在创建新的换行符。美化 HTML 将无济于事，因为这些行不是“错误”。

我用什么：

<!-- Theme
============================================= -->
<%if (theme == "main") { %>
<link rel="stylesheet" href="css/theme.css" />
<% } %>

结果。 HTML <link> 上方和下方的换行符

<!-- Theme
============================================= -->

<link rel="stylesheet" href="css/theme.css" />

这就是我想要的，上面和下面没有任何换行符：

<!-- Theme
============================================= -->
<link rel="stylesheet" href="css/theme.css" />

有一种技巧可以像这样在一行中完成所有操作，但如果代码太长，这会变得很难看。

<!-- Theme
============================================= -->
<%if (theme == "main") { %><link rel="stylesheet" href="css/theme.css" /><% } %>

【问题讨论】：

标签： javascript webpack lodash

【解决方案1】：

您可以使用_.trim() 从结果的开头和结尾删除\n，并使用正则表达式_.replace() 将多个连续的\n 转换为单个：

const str = `<!-- Theme
============================================= -->
<%if (theme == "main") { %>
<link rel="stylesheet" href="css/theme.css" />
<% } %>`;

const compiled = _.template(str);

const fn = _.flow([
  compiled,
  str => _.trim(str, '\n'),
  str => _.replace(str, /(\n)\1+/, '$1'),
]);

const result = fn({ 'theme': 'main' });

console.log(result);

.as-console-wrapper {
  top: 0;
}

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"&gt;&lt;/script&gt;

【讨论】：