backbone.js - Problems loading backbonejs and underscorejs with requirejs -
i have problems loading libraries shim option in requirejs (maybe, because poor background on library). try in documentation , see other pages problem persist.
this app folder structure:
index.html js/main.js js/app/router.js js/app/app.js js/views/homeview.js js/libs/backbone/backbone-1.0.0.js js/libs/underscore/underscore-1.5.1.js js/libs/jquery/jquery-1.10.2.js js/libs/require/require-2.1.8.js all start in index.html:
<!doctype html> <html> <head> <meta charset="utf-8" /> <meta name="format-detection" content="telephone=no" /> <meta name="viewport" content="width=device-width, user-scalable=no" /> <link rel="stylesheet" type="text/css" href="css/index.css" /> <title>app</title> </head> <body> <div class="page"> loading... </div> <script data-main="js/main" src="js/libs/require/require-2.1.8.js"></script> </body> </html> that loads main.js
require.config({ shim: { underscore: { exports: '_' }, backbone: { deps: ['underscore', 'jquery'], exports: 'backbone' }, }, paths: { app: 'app', mod: 'app/mods', backbone: 'libs/backbone/backbone-1.0.0', underscore: 'libs/underscore/underscore-1.5.1', jquery: 'libs/jquery/jquery-1.10.2', }, }); require([ 'app/app', ], function (app) { app.initialize(); }); that defines paths libraries , shim options non-amd libraries.
then comes app.js
define([ 'app/router', ], function(router) { var initialize = function() { //var router = new router(); //router.initialize(); router.initialize(); }; return { initialize: initialize, }; }); then router.js:
define([ 'jquery', 'underscore', 'backbone', 'app/views/homeview', ], function($, _, backbone, homeview) { var approuter = backbone.router.extend({ routes: { '': 'home', } }); var initialize = function() { var approuter = new approuter(); var homeview = new homeview(); approuter.on('route:home', function() { userlistview.render(); console.log('we have loaded home page.'); }); backbone.history.start(); }; return { initialize: initialize, }; }); now here have problem beacause looking @ network tab in chrome developer tools jquery loads, nor backbone or underscore.
then, , finally, because it's defined reference view, loads homeview.js
define([ 'jquery', 'underscore', 'backbone', 'libs/text!app/tpl/home.html', ], function($, _, backbone, hometpl) { var homeview = backbone.view.extend({ el: '.page', render: function() { //var self = this; //users.fetch({ // success: function() { var template = _.template(hometpl, {}); //self.$el.html(template); this.$el.html(template); // } //}); }, }); return homeview; }); and problem, because @ line
var homeview = backbone.view.extend({ shows error: "uncaught typeerror: cannot read property 'view' of undefined", think that's because backbone never loads. ¿can tell i'm doing terribly wrong? looking code , several pages day , cannot figure out answer. in advance , apoliges long question, buy i've seen many people having same issue , maybe answer others too.
can't find wrong, don't need load app modules in paths
paths: { app: 'app', // remove
Comments
Post a Comment