javascript - HandlebarsJS 预编译模板中的空白

Question

我正在迁移我的一个项目以使用 HandlebarsJS 模板而不是下划线模板，我遇到了一个非常奇怪的问题。

我正在使用预编译的模板，并且在任何地方我都将渲染的模板附加到 DOM 我得到了一个空的文本元素，这导致了布局问题，用空白渲染代替了它们

查看 chrome 开发控制台显示附加到 div 的 3 个模板的以下标记：

> <div>
      ""
      <div><!--content --></div>
      ""
      <div><!--content --></div>
      ""
      <div><!--content --></div>
  </div>

将父 div HTML 转储到 javascript 控制台时，根本没有任何空格，这很简单：

<div><!--content --></div><div><!--content --></div><div><!--content --></div>

Answer 1

好的，现在已经解决了，根据对原始问题的评论，问题是在预编译期间添加的 \ufeff 字符，即使启用了可见的空白选项，我的 IDE 和开发者浏览器扩展也不会显示该字符。

为了解决这个问题，我更新了我的模板附加代码

$container.append(template({ *data* }).replace(/\ufeff/, ''));