0

我正在尝试将 JST 模板用于使用 Backbone 的项目。一切似乎都正常，但我遇到了一个我无法解决的语法错误。

这是控制台输出的内容：

Running "jst:compile" (jst) task
>> SyntaxError: Unexpected token =
Warning: JST failed to compile. Use --force to continue.

Aborted due to warnings.

运行 --verbose

Verifying property jst.compile exists in config...OK
Files: templates/ideas/idea.jst -> scripts/templates/ideas/idea.js
Files: templates/ideas/idea_index.jst -> scripts/templates/ideas/idea_index.js
Options: namespace="JST", templateSettings={"interpolate":{}}, processContent=undefined, separator="\n\n", prettify, processName=undefined
Reading templates/ideas/idea.jst...OK
>> SyntaxError: Unexpected token =
Warning: JST failed to compile. Use --force to continue.

Aborted due to warnings.

这是它试图编译的文件：

<!-- IDEA START -->
<div class="ideadata" data-id="<%= id %>" data-date="<%= this.date %>" data-votes="<%= this.votes %>">

  <!-- Id -->
  <span class="id">#<%= this.id %></span>

  <!-- Idea -->
  <p><%= this.content %></p>

  <!-- Voting and social options -->
  <div class="social">
    <!-- VOTER -->
      <!-- HTML -->
    <!-- END -->

    <a href="#" onclick="window.open(
      'https://twitter.com/intent/tweet?original_referer=' + encodeURIComponent(location.href) + '&screen_name=roskildefestival&text=<%= this.content %>&tw_p=tweetbutton', 
      'twitter-share-dialog', 
      'width=550,height=390');
        return false;"><img src="http://cdn3.iconfinder.com/data/icons/picons-social/57/03-twitter-20.png" /></a>

    <a href="#" onclick="window.open(
      'https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(location.href), 
      'facebook-share-dialog', 
      'width=626,height=436');
        return false;"><img src="http://cdn3.iconfinder.com/data/icons/wpzoom-developer-icon-set/500/01-20.png" /></a>
  </div>

</div>
<!-- IDEA END -->

我试过用 <% 替换 <%= ，这似乎是成功的，但这不是我想要实现的。

我在这里做错了什么还是这不是编写 JST 模板的正确方法？

当我在 Rails 上运行时，我曾经使用 *.jst.eco 作为我的模板文件，但由于这是一个 PHP 项目，我需要找出另一种方法来做事，因此也不确定这是否是最好的方法做或不做。

第一次编辑：

因此，在获得一些反馈后，我尝试使用以下代码将其分解为最简单的：

<% if(true){ %>
  <div>Hey</div>
<% } %>

它成功编译并给了我这个：

this["JST"] = this["JST"] || {};

this["JST"]["ideas/idea"] = function(obj) {obj || (obj = {});var __t, __p = '', __e = _.escape, __j = Array.prototype.join;function print() { __p += __j.call(arguments, '') }with (obj) { if(true){ ;__p += '\n  <div>Hey</div>\n'; } ;}return __p};

而这个，编译失败：

<div><%= this.id; %></div>
4

2 回答 2

1

对于遇到此问题的任何其他人，答案在评论中引用的 github 问题中。[github.com/gruntjs/grunt-contrib-jst/issues/29] 答案是：

如果你想像 _.template 一样解析模板，那么你不能覆盖 templateSettings。

所以我改变了这个：

      jst: {
        compile: {
          options: {
             templateSettings: {
               interpolate : /\{\{(.+?)\}\}/g
             }
          },
          files: {
            "<%= buildDir %>/templates.js": ["source.html"]
          }
        }
      }

对此：

      jst: {
        compile: {
          options: {

          },
          files: {
            "<%= buildDir %>/templates.js": ["source.html"]
          }
        }
      }
于 2013-08-20T11:19:41.703 回答
0

我想我发现了你的错误：

<!-- IDEA START -->
<div class="ideadata" data-id="<%= id %>"

不应该<%= this.id %>吗？如果找不到id，那么它将是空的，因此您将有一个 open =，这可能会导致错误？

于 2013-06-28T20:34:48.723 回答