Backbone not defined in Meteor app

Question

I have been working on a Meteor app and want to add multi-page functionality with Backbone's routing capabilities. However, when I do this:

meteor add backbone
meteor add underscore

and then try to create a simple 'hello World' within the app it crashes with the message:

ReferenceError: Backbone is not defined
at app/backbone.js:33:2
at run (/Users/timj/Documents/backbone/.meteor/local/build/server/server.js:142:63)
at Array.forEach (native)
at Function._.each._.forEach (/usr/local/meteor/lib/node_modules/underscore/underscore.js:79:11)
at run (/Users/timothyjaeger/Documents/backbone/.meteor/local/build/server/server.js:142:7)
Exited with code: 1

Not sure what I am doing wrong since I already added backbone to my meteor app! The js looks like this:

backbone-test-app.js

if (Meteor.isClient) {

      var AppView = Backbone.View.extend({
      // el - stands for element. Every view has a element associate in with HTML content will be rendered.
      el: '#container',
      // It's the first function called when this view it's instantiated.
      initialize: function(){
        this.render();
      },
      // $el - it's a cached jQuery object (el), in which you can use jQuery functions to push content. Like the Hello World in this case.
      render: function(){
        this.$el.html("Hello World");
      }
    }); 

var appView = new AppView();
}

    if (Meteor.isServer) {
  Meteor.startup(function () {
    Backbone.history.start({pushState: true});
        // code to run on server at startup
      });
    }

score 0 · Accepted Answer · edited May 23 '17 at 12:04

0

Backbone is a client side framework. You need to move the code to the client's side only by removing the backbone related code from the if (Meteor.isServer) {..} and placing it into the if (Meteor.isClient) {..}.

If you use the client and server folder to partition your code you don't need to use if (Meteor.isServer) {..} or if (Meteor.isClient) {..}, you only need to place backbone related code into the client folder.

I think the todos app uses backbone, if not have a look at this question on how to use it on the client side:

How do I create dynamic URL's with Meteor?

Also there is a package for meteor called meteor-router which does a fantastic job of routing between pages too, which may also suit your needs more comfortably. You can find more info at:

https://github.com/tmeasday/meteor-router

edited May 23 '17 at 12:04

Community

1
1

answered Jan 12 '13 at 22:08

Tarang

75,157
39
215
276

Backbone can be used on the server too! – Pete Mitchell Jan 12 '13 at 22:11
It can?? I'm so lost on how its possible?, I'm aware the more abstract bits of it (models, etc) can be run on the server but I don't think the routing bits of it can – Tarang Jan 12 '13 at 22:11
Well some client specific stuff like the router, history etc doens't really work on the server. But you can structure your data on the server using backbone models/collections. – Pete Mitchell Jan 12 '13 at 22:13
Ahh that makes sense, If you really want to use backbone on the server you would need to install the backbone with npm (in /usr/local/meteor/lib/) and require it with `var Backbone = __meteor_bootstrap__.require('backbone');` – Tarang Jan 12 '13 at 22:16
That is not necessarily true. I am currently using `Backbone.Collection` in the `server/` directory of my Meteor app, I only used `meteor add backbone` and I am not using NPM. – Pete Mitchell Jan 12 '13 at 22:27
I misunderstood because the error displayed it not being defined on the server end – Tarang Jan 12 '13 at 22:31
I took the code out and placed it in the (Meteor.isClient) section, however there is no indication that Backbone is actually working at all. I.e. the 'hello world' app doesn't function..so the answer is correct, I am still left wondering how in the world to correctly insure that Backbone is working – squeezemylime Jan 12 '13 at 22:52
Try using the Chrome developer tools in the console see if Backbone is defined and you could toy with it to double check – Tarang Jan 12 '13 at 23:02
Also have a look at meteor-router it also does server side routing and it looks like what you want – Tarang Jan 13 '13 at 08:16

Backbone not defined in Meteor app

1 Answers1