Do Backbone.js views require jQuery or Zepto? (Or: why am I getting “Uncaught TypeError: undefined is not a function”?)

Question

I’m just starting out with Backbone.js. I’ve subclassed Backbone.Model and Backbone.View:

var Message = Backbone.Model.extend();

var MessageView = Backbone.View.extend({
    tagName: 'div',
    className: 'message',
    template: _.template('{{ html }}'),

    render: function(){
        this.template({
            html: this.model.html
        });
        this.el.className.append(' ' + this.model.type);

        return this;
    }
});

I’ve then attempted to create an instance of each:

var message = new Message({html: html, type: type});
var messageView = new MessageView({model: message});

The last line line causes an error (in Chrome 12): Uncaught TypeError: undefined is not a function. It traces this error back to the function f.extend.make in Backbone.js.

The Backbone.js documentation on view.make says:

Convenience function for creating a DOM element of the given type (tagName), with optional attributes and HTML content. Used internally to create the initial view.el.

1. Does it require jQuery or Zepto?
2. Could I remove this dependency by overriding view.make in my call to Backbone.View.extend?

Answer 1

1) The documentation states that it requires

either jQuery ( > 1.4.2) or Zepto.

2) The View Component is tightly coupled to the jQuery/Zepto API. You could reimplement it, but if you use backbone.js extensively, you will reimplement the whole interface.

But maybe it works with your small use-case, but becuase of the tight coupling I would not guarantee that it works.