CODEWITHSUNDEEP
javascriptbackbone.jsrequirejs
HerrPfister
HerrPfister

Reputation: 67

Backbone is null

I'm using backbone and require js for a simple app I am trying to make. However, every time I try to run the app in the browser I get a "Backbone is null" error. I pin pointed it to the line where it try's to extend the Backbone model, but I have no idea why Backbone comes in as null? Anyone have any suggestions? I have been reading up on and messing around with the require.config but it still doesn't work.

//main.js (this is my data-main)

require.config({
     baseUrl: 'scripts/lib',
     paths: {
         'model': '../app/models'
     },
     waitSeconds: 30,
     shim: {
         'backbone': {
             deps: ['underscore', 'jquery'],
             exports: 'Backbone'
         },
         'underscore': {
             exports: '_'
         }
     }
 });
 require([
     'jquery',
     'underscore',
     'backbone',
     'model/comic'
 ], function (
     $,
     _,
     Backbone,
     Comic
 ) {
     console.log("Files loaded successfully");
 });

 //comic.js (this is my model)

 require(["backbone"], function (Backbone) {
     return Backbone.Model.extend({
         initialize: function (options) {
             this.comicName = options.comicName || "";
             this.author = options.author || "";
             this.issueNumber = options.issueNumber || "";
             console.log(this.comicName);
         }
     });
 });

Directory Hierarchy
-------------------
    main.html
    assets
      scripts
        app
          models
            comic.js
        lib
          backbone.js
          underscore.js
          require.js
          jquery.js
      styles
        bootstrap.min.css

Upvotes: 0

Views: 180

Answers (1)

jax
jax

Reputation: 38583

In your paths object you need to tell requirejs where to find the backbone .js file with the alias of 'backbone'. You will have to do the same with underscore and jquery

paths:{
    'model' : '../app/models',
    'backbone' : 'path/to/backbone-min', //note you don't put the .js extension here
    'underscore' : 'path/to/underscore-min',
    'jquery' : 'path/to/jquery-min'

},

Upvotes: 2

Related Questions