“_未定义”HTML文件中的下划线错误

时间:2013-07-03 21:34:13

标签: javascript node.js backbone.js underscore.js ejs

来自node.js项目的这个html文件,该文件最初是jedireza的Drywall.js项目的玉石注册文件。它在GitHub上的位置是: https://github.com/jedireza/drywall/blob/master/public/views/signup/index.js

通过jade的内部转换器转换并使用ejs模板引擎进行渲染后,它出现了以下错误:

_ is not defined
    at eval (eval at <anonymous> (/var/lib/stickshift/51cee2af5973cad1b20002b5/app-root/data/543117/node_modules/ejs/lib/ejs.js:236:14))                                                                                                                                   
    at eval (eval at <anonymous> (/var/lib/stickshift/51cee2af5973cad1b20002b5/app-root/data/543117/node_modules/ejs/lib/ejs.js:236:14))                                                                                                                                   
    at exports.compile (/var/lib/stickshift/51cee2af5973cad1b20002b5/app-root/data/543117/node_modules/ejs/lib/ejs.js:249:15)                                                                                                                                              
    at Object.exports.render (/var/lib/stickshift/51cee2af5973cad1b20002b5/app-root/data/543117/node_modules/ejs/lib/ejs.js:287:13)   

HTML文件如下:

<!DOCTYPE html>
<html>
   <head>
        <title>Sign Up</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="/vendor/bootstrap/css/bootstrap.min.css">
        <link rel="stylesheet" href="/vendor/bootstrap/css/bootstrap-responsive.min.css">
        <link rel="stylesheet" href="/vendor/font-awesome/css/font-awesome.min.css">
        <link rel="stylesheet" href="/layouts/utility.css">
        <link rel="stylesheet" href="/layouts/default.css">
        <script src="/vendor/jquery/jquery-1.9.1.min.js"></script>
        <script src="/vendor/underscore/underscore-min.js"></script>
        <script src="/vendor/backbone/backbone-min.js"></script>
        <script src="/vendor/bootstrap/js/bootstrap.min.js"></script>
        <script src="/layouts/utility.js"></script>
        <script src="/views/signup/index.js"></script>
        <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/0.10.0/lodash.min.js"></script>
   </head>
   <body>
      <div class="navbar navbar-fixed-top">
         <div class="navbar-inner">
            <div class="container">
               <a data-toggle="collapse" data-target=".nav-collapse" class="btn btn-navbar"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></a><a href="/" class="brand"><img src="/media/logo-black.png" width="150"></a>
               <div class="nav-collapse">
                  <ul class="nav">
                     <li><a href="/">Home</a></li>
                     <li><a href="/about/">About</a></li>
                     <li><a href="/signup/">Sign Up</a></li>
                     <li><a href="/contact/">Contact</a></li>
                  </ul>
                  <ul class="nav pull-right">
                     <li><a href="/login/"><i class="icon-user"></i> Login</a></li>
                  </ul>
               </div>
            </div>
         </div>
      </div>
      <div class="page">
         <div class="container">
            <div class="page-header">
               <h1>Sign Up</h1>
            </div>
            <div id="signup"></div>
            <script type="text/template" id="tmpl-signup"><form class="form-horizontal"><div class="alerts">
            ***<% _.each(errors, function(err)*** { %><div class="alert alert-error"><button type="button" data-dismiss="alert" class="close">&times;</button><%= err %></div><% }); %>
            </div><div class="control-group &lt;%= errfor.username ? &quot;error&quot; : &quot;&quot; %&gt;"><label class="control-label">Pick a Username:</label><div class="controls"><input type="text" name="username" value="<%= username %>"><span class="help-inline"><%= errfor.username %></span></div></div><div class="control-group &lt;%= errfor.email ? &quot;error&quot; : &quot;&quot; %&gt;"><label class="control-label">Enter Your Email:</label><div class="controls"><input type="text" name="email" value="<%= email %>"><span class="help-inline"><%= errfor.email %></span></div></div><div class="control-group &lt;%= errfor.password ? &quot;error&quot; : &quot;&quot; %&gt;"><label class="control-label">Create a Password:</label><div class="controls"><input type="password" name="password" value="<%= password %>"><span class="help-inline"><%= errfor.password %></span></div></div><div class="form-actions"><button type="button" class="btn btn-primary btn-signup">Create My Account</button></div></form></script>
         </div>
      </div>
      <div class="footer">
         <div class="container">
            <div class="inner">
               <span class="copyright pull-right">&#169;  </span>
               <ul class="links">
                  <li><a href="/">Home</a></li>
                  <li><a href="/about/">About</a></li>
                  <li><a href="/signup/">Sign Up</a></li>
                  <li><a href="/contact/">Contact</a></li>
               </ul>
               <div class="clearfix"></div>
            </div>
         </div>
      </div>
      <div class="ajax-spinner"><img src="/media/ajax-pulse.gif"></div>

   </body>
</html>

粗体和斜体的行是触发错误的行。 underscore.js文件已包含在内。感谢您的任何建议和帮助!

2 个答案:

答案 0 :(得分:0)

http://underscorejs.org添加underscore.js。

这确实是js错误。

答案 1 :(得分:0)

据我所知,脚本标签中不会解析任何内容。你可能需要这样做:

| <script type="text/template" id="tmpl-signup">
form.form-horizontal
  .alerts
    |<% _.each(errors, function(err) { %>
    p foo
    |<% }); %>
| </script>

看起来好像你的Jade还在逃避几行:

span.help-inline <%= errfor.username %>
...
span.help-inline <%= errfor.email %>
...
span.help-inline <%= errfor.password %>

应该是

span.help-inline!= "<%= errfor.username %>"
...
span.help-inline!= "<%= errfor.email %>"
...
span.help-inline!= "<%= errfor.password %>"
  

取消HTML:!=

     

后跟一个或两个等于字符的感叹号进行评估   Scala代码就像equals一样,但从不清理HTML。   当TemplateEngine.escapeMarkup选项设置为false时,=表现   与!=相同。但是,如果是TemplateEngine.escapeMarkup选项   设置为true,=将清理HTML,但是!=仍然不会。

     

http://scalate.fusesource.org/documentation/jade-syntax.html#unescaping_html