Domanda

When I run the r.js optimizer over my Backbone.js app, I get this error:

Uncaught TypeError: undefined is not a function

It appears in the middle of the Backbone.js section of the output.

I removed bits of code until I found out what was causing it, and it seems to be when I call Backbone.history.start();.

I've created a simple app to replicate the bug, which I've posted below. Basically, it creates a route and 'console.log's 'home'. It works fine when not optimized.

To optimize the app, I use:

node r.js -o app.build.js

from the /js folder.

I have Backbone.js 0.9.2, RequireJS 2.1.1, r.js 2.1.1

Has anyone come across this before? I'm still fairly new to Backbone.js/RequireJS, so hopefully it's just something stupid I'm doing wrong.

Folder Structure

/js
  /libs
    - backbone.js
    - require.js
    - underscore.js
  - app.build.js
  - r.js
  - site.js
index.html

Code

index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

    <script data-main="/js/site.js" src="/js/libs/require.js"></script>

</body>
</html>

site.js

requirejs.config({
    baseUrl     : 'js/',
    paths       : {
        jquery          : '//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min',
        backbone        : 'libs/backbone',
        underscore      : 'libs/underscore'
    },
    shim        : {
        backbone        : {
            deps            : ['underscore', 'jquery'],
            exports         : 'Backbone'
        },
        underscore      : {
            exports         : '_'
        }
    }
});

require(['jquery', 'backbone'], function($, Backbone) {

    var Router = Backbone.Router.extend({
            routes      : {
                ''          : 'home'
            },
            home        : function(){
                console.log('home');
            }
        }),
        appRouter;

    $(function() {

        appRouter = new Router();
        Backbone.history.start();

    });

});

app.build.js

({
    baseUrl: ".",
    name: 'site',
    paths: {
        jquery: 'empty:',
        underscore: 'libs/underscore',
        backbone: 'libs/backbone'
    },
    out: 'site-built.js',
    shim        : {
        backbone        : {
            deps            : ['underscore', 'jquery'],
            exports         : 'Backbone'
        },
        underscore      : {
            exports         : '_'
        }
    }
})

Thanks!

Update

Here's the output of site-built.js. Can anyone see anything obviously wrong with it?

http://pastebin.com/Rbm7J83X

È stato utile?

Soluzione

I inlined jQuery and it seems to work OK now. (It's mentioned at the bottom of the API shim docs on requirejs.org, but not anywhere on the Optimize section.)

Not sure if this is the correct fix, but hopefully it will help someone else.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top