任何人都可以在 _.template 中解释 Underscore 的预编译吗?

Can anyone explain Underscore's precompilation in _.template?

我阅读了 Underscore 的文档,在 _.template 中找到:

Precompiling your templates can be a big help when debugging errors you can't reproduce. This is because precompiled templates can provide line numbers and a stack trace, something that is not possible when compiling templates on the client. The source property is available on the compiled template function for easy precompilation

我想知道它的含义和用法。

我写的代码如下:

<div>
  <ul class="list">
    <li>apple</li>
    <li>orange</li>
    <li class="last-item">peach</li>
  </ul>
</div>

<script src="underscore.js"></script>

<script type="text/template" id="tpl">
  <ul class="list">
    <%_.each(obj, function(e, i, a){%>
      <% if (i === a.length - 1) %>
        <li class="last-item"><%=e.name%></li>
      <% else %>
        <li><%=e.name%></li>
    <%})%>
  </ul>
</script>

<script>
var data = [{name: "apple"}, {name: "orange"}, {name: "peach"}];
var compiled = _.template(document.getElementById("tpl").innerHTML);
var str = compiled(data);
document.querySelector("div").innerHTML = str;
</script>

它运行良好,在我看来,当我在模板中遗漏 > 时,通过预编译它会告诉我遗漏了哪一行 >,对吗?以及如何做演示?下面的代码直接放可能就不行,那么如何让它有用呢?

<script>
  JST.project = <%= _.template(jstText).source %>;
</script>

您不必使用 angular 括号。只需执行以下操作:

<script>
    const yourData = {};
    JST.project = _.template(jstText)(yourData);
</script>

这应该是诀窍:)

JST 是服务器端,而不是客户端。这意味着您通过某些服务器端脚本在 服务器端 上编译 Unserscore 模板并将结果保存在文件中。然后使用此文件作为已编译 Unserscore 模板。