2

谁能帮助确定以下 Ember.js/Require.js 应用程序无法呈现索引视图的原因?Ember 部分 100% 独立工作。

应用程序.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <script data-main="../script/application" src="http://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.4/require.min.js"></script>
  </head>
  <body>
    <script type="text/x-handlebars-template" data-template-name="index">
      login page
      <a href="#" {{action "login"}}>Login</a>
    </script>
    <script type="text/x-handlebars-template" data-template-name="application">
      {{outlet}}
    </script>
  </body>
</html>

应用程序.js

require(["library/jquery", "library/handlebars", "library/ember"], function() {
    Application = Ember.Application.create({
        LOG_TRANSITIONS: true
    });

    Application.IndexView = Ember.View.extend({});

    Application.IndexController = Ember.Controller.extend({
        login: function() {
            console.log("called login controller method.");
        }
    });

    Application.Router.map(function() {
        this.route("index", {
            path: "/login" 
        });
    }); 
});

我已确认 Require 已成功加载以下文件,并且 Safari 或 Chrome 浏览器中未显示脚本错误。

  • 应用程序.html
    • 应用程序.js
    • 余烬.js
    • 车把.js
    • jQuery.js
    • 要求.min.js

版本信息

要求:2.1.4

jQuery:v1.9.1

余烬:v1.0.0-rc.1

车把:1.0.0-rc.3

4

2 回答 2

4

因此,经过一段时间的头部撞击和一夜情。我终于得到了一个 Ember & Require 玩得很好的例子。

https://github.com/ben-crowhurst/EmberRequireSetup

发现了一些与加载应用程序模块/依赖项有关的问题,以及 Ember 设置和 DOM 解析的时间。

于 2013-02-27T10:58:18.150 回答
2

该问题可能是由于未将依赖项传递给函数体引起的。不这样做只有在所有依赖项都“安装”在全局范围内时才有效(这样做的好处之一requirejs是您可以完全不用担心这一点)。

试试这个:

require(["library/jquery", "library/handlebars", "library/ember"],
  function($, handlebars, Ember) {

    // verify that none of these is undefined
    console.log($, handlebars, Ember);

    var Application = Ember.Application.create({
        LOG_TRANSITIONS: true
    });

    (...)
});

如果打印到控制台的任何变量仍然存在,则undefined表明您的requirejs配置不正确。我强烈推荐 Chrome 的开发工具:您可以在函数体的第一行设置断点,并在应用程序冻结时调查本地/闭包范围。“暂停未捕获的异常”也有很大帮助。

此外,最好避免从模块内创建全局对象(这就是我var在 Application 变量中添加 a 的原因);模块的目的之一是严格限制外部“泄漏”的内容。

最后,我不相信requirejs会使用Handlebars存储在标签内的<script>代码。甚至不能保证Handlebars在浏览器处理application.html. 我从来没有使用过handlebars,但如果是这样的话,我确信处理这个问题的正确方法已经在某处了:)。

于 2013-02-26T23:07:48.190 回答