backbone.js - Backbone Views as CommonJS modules -


i'm trying head around using commonjs modules within backbone application, have skeleton backbone view defined in /views/categories/edit.js:

app.views.quotecategoriesedit = app.ui.modalview.extend({      classname: '',      template: jst["templates/quotes/categories/quote-categories-edit.html"],     events: {         'click [data-key="save"]': 'save',         'click [data-key="cancel"]': 'cancel'     },     initialize: function (options) {         var = this;         _.bindall(this, 'save', 'cancel');         app.collections.quotescategories.on('change add', function () {             that.remove();         });     },      render: function () {         var = this;         // boilerplate render code         return this;     }  }); 

if show me how can convert commonjs module used browserify, grateful , it'd me understand how go modularising rest of application! thanks

//once things folders/files, path may change //but i'm assuming views live in same directory  var modalview = require('./modal-view');  var quotecategoriesedit = modalview.extend({      classname: '',      template: jst["templates/quotes/categories/quote-categories-edit.html"],     events: {         'click [data-key="save"]': 'save',         'click [data-key="cancel"]': 'cancel'     },     initialize: function (options) {         var = this;         _.bindall(this, 'save', 'cancel');         app.collections.quotescategories.on('change add', function () {             that.remove();         });     },      render: function () {         var = this;         // boilerplate render code         return this;     }  }); //simplest convention 1-class-per-module //just export constructor function module.exports = quotecategoriesedit; 

follow-up question comments:

very appreciate this! how approach: app.collections.quotescategories house under app namespace? require collection itself?

so idea of "app" namespace opposite of being modular/commonjs/browserify/requirejs. don't need app object anymore. module needs create new instance of collection var quotescategories = require('app/collections/quotes-categories'); , all. no more globals or namespace objects. views models/collections need in constructor function options. of models created calling fetch on collection, , of collections instantiated router.

oh, , yes in specific example it's best if non-view code creates collection , passes view via constructor options.collection parameter. however, if decided yes wanted view instantiate collection, wouldn't come app global namespace object, come require call describe in comment.


Comments