Kann nicht Eigentum ‚Ansicht‘ undefinierter

Question

Dies ist mein erstes Mal verwenden require.js mit Rückgrat lesen, und ich kämpfe, um das Problem mit meinem Blick zu finden:

Cannot read property 'View' of undefined // search.js:8 

Meine Verzeichnisstruktur ist:

. 
├── index.php 
└── js 
   ├── app.js 
   ├── lib 
   │   ├── backbone.js 
   │   ├── backbone-min.js 
   │   ├── jquery-min.js 
   │   ├── require.js 
   │   └── underscore-min.js 
   ├── main.js 
   ├── model 
   ├── router.js 
   ├── text.js 
   └── view 
    ├── error.js 
    └── search.js 

Mein main.js:

require.config({ 
    paths: { 
    jquery: 'lib/jquery-min', 
    underscore: 'lib/underscore-min', 
    backbone: 'lib/backbone-min', 
    templates: '../templates' 
    } 

}); 

require([ 
    'app' 
], function(App){ 
    App.initialize(); 
}); 

Mein app.js:

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'router', // Request router.js 
], function($, _, Backbone, Router){ 

    var initialize = function(){ 
    // Pass in our Router module and call it's initialize function 
    Router.initialize(); 
    } 

    return { 
    initialize: initialize 
    }; 
}); 

Mein router.js:

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'view/search', // requests view/search.js 
], function($, _, Backbone, SearchView){ 

    var AppRouter = Backbone.Router.extend({ 
    routes: { 
     "": "home" 
    } 
    }); 

    var initialize = function(){ 
    var app_router = new AppRouter; 
    app_router.on('route:home', function(){ 
     var homeView = new SearchView(); 
     homeView.render(); 
    }); 
    Backbone.history.start(); 
    }; 
    return { 
    initialize: initialize 
    }; 
}); 

und meine view/search.js:

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

    // console.log($,_,Backbone); 

    var SearchView = Backbone.View.extend({ 
    ... 
    }); 

    return SearchView; 
}); 

Wenn ich die console.log oben unkommentiert, beide _ und Backbone ist undefined aber $ nicht. Was habe ich verpasst? Alle meine lib-Dateien haben die neueste Version.

Answer 1

Backbone und Underscore sind nicht AMD-kompatibel. Standardmäßig bieten sie keine mit RequireJS kompatible Schnittstelle.

In den letzten Versionen, RequireJS provide a useful way to solve the problem:

Ihre main.js:

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

}); 

require([ 
    'app' 
], function(App){ 
    App.initialize(); 
}); 

Answer 2

Um BAK Antwort zu verlängern, werden Sie zur Verfügung stellen müssen auch eine baseUrl:

require.config({ 
    baseUrl: 'js', 
... 
});