骨干.js未捕获的类型错误：无法读取null的属性“视图”

Question

当我在 NetBeans 7.3.1 中运行我的主干应用程序时，主页会显示几秒钟，可能是 5 或 6 秒钟，然后在 NetBeans 输出中我看到以下内容...

Uncaught TypeError: Cannot read property 'View' of null (18:43:36:307 | error, javascript)
    at  (js/views/HomeView.js:6:28)
    at d.execCb (js/libs/require/require.js:27:197)
    at o (js/libs/require/require.js:10:471)
    at  (js/libs/require/require.js:12:184)
    at o (js/libs/require/require.js:12:75)
    at  (js/libs/require/require.js:14:1)
    at o (js/libs/require/require.js:12:75)
    at l (js/libs/require/require.js:12:336)
    at g.finishLoad (js/text.js:10:192)
    at g.load (js/text.js:10:354)
    at window.undefined.window.navigator.window.document.c.onreadystatechange (js/text.js:7:30)
Uncaught TypeError: Cannot read property 'Model' of null (18:43:36:317 | error, javascript)
    at  (js/models/Member.js:6:26)
    at d.execCb (js/libs/require/require.js:27:197)
    at o (js/libs/require/require.js:10:471)
    at x (js/libs/require/require.js:15:186)
    at m (js/libs/require/require.js:15:207)
    at g.completeLoad (js/libs/require/require.js:21:388)
    at d.onScriptLoad (js/libs/require/require.js:27:490)
Uncaught Error: Load timeout for modules: text!templates/homeTemplate.html 
http://requirejs.org/docs/errors.html#timeout (18:43:38:511 | error, javascript)
    at N (js/libs/require/require.js:7:217)
    at A (js/libs/require/require.js:16:230)
    at  (js/libs/require/require.js:16:394)

RequireJS 似乎无法加载 Backbone。这里是main.js...

// Filename: main.js

require.config({
    shim: {
        underscore: {
            exports: '_'
        },
        backbone: {
            deps: ['underscore', 'jquery'],
            exports: 'Backbone'
        }
    },
    paths: {
        jquery: 'libs/jquery/jquery-min',
        underscore: 'libs/underscore/underscore-min',
        backbone: 'libs/backbone/backbone-min',
        templates: '../templates'
    }
});

require([
    'app',

], function(App) {
    App.initialize();
});

我完全在这方面旋转我的轮子。为什么 Require 没有加载 Backbone？

@Sushanth--：编辑原始帖子以包含 HomeView.js

这里是 HomeView.js...

define([
    'jquery',
    'underscore',
    'backbone',
    'text!templates/homeTemplate.html'
], function($, _, Backbone, homeTemplate) {

    var HomeView = Backbone.View.extend({

        el: $("#page"),

        initialize: function() {
        },

        render: function() {
            var compiledTemplate = _.template( homeTemplate, {} );
            this.$el.html( compiledTemplate ); 
        }

    });

    return HomeView;

});

@Sushanth--：我正在从 router.js 渲染...

// Filename: /js/router.js

define([
    'jquery',
    'underscore',
    'backbone',
    'views/HomeView',
    'views/MembersView'
], function($, _, Backbone, HomeView, MembersView) {

  var AppRouter = Backbone.Router.extend({
    routes: {
      // Define some URL routes
      'members': 'showMembers',
      // Default
      '*actions': 'defaultAction'
    }
  });

  var initialize = function(){
      //alert('router init');
    var app_router = new AppRouter;

    app_router.on('route:showMembers', function () {
        // Like above, call render but know that this view has nested sub views which 
        // handle loading and displaying data from the GitHub API  
        var membersView = new MembersView();
    });

    app_router.on('route:defaultAction', function (actions) {
        // We have no matching route, lets display the home page 
        var homeView = new HomeView();
        homeView.render();
    });

    // Unlike the above, we don't call render on this view as it will handle
    // the render call internally after it loads data. Further more we load it
    // outside of an on-route function to have it loaded no matter which page is
    // loaded initially.
    //var footerView = new FooterView();

    //alert('hello from router.js');
    //Backbone.history.start({pushState: true, root: "/modular-backbone/"});
    //Backbone.history.start({pushState: true});
    Backbone.history.start();
    };

    return { 
        initialize: initialize
    };
});

在 main.js、app.initialize... 中添加了一个测试警报

require(['app'], function(App) {
    // THIS ALERT NEVER DISPLAYS!?!?!
    alert('inside main.js before app.initialize');
    App.initialize();
});

Answer 1

我用 AMD 版本替换了我的 Backbone 和 Underscore js 文件，它开始工作了。