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

Question

I am rendering HTML from lodash templates (using webpack) but lodash templates are creating new line breaks. Beautifying the HTML will not help as those lines are not "mistakes".

What I use:

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

The result. New line breaks above and below the HTML <link>

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

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

This is how I want it without any new line breaks above and below:

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

There is a hack to do it all in one line like this but this will get ugly with long code.

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

Answer 1

You can use _.trim() to remove \\n from the start and end of the result, and _.replace() with a RegExp to convert multiple consecutive \\n to a single one:

 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; } 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>