1

How do you correctly use Require.js to load a module that returns a constructor function that has require dependencies?

My problem seems to be a scope issue, I have seen some modules that are available within the returned constructor like "durandal/app" and I dont see how they are scoped any different than the modules I have defined.

This example is modified from Durandal Creating a Module docs

define([**someothermodule**, "durandal/app"], function(**someothermodule**, app){
var backend = function(username, password){  
    this.username = username;  
    this.password = password;  
    someothermodule.whatever(); <--someothermodule is not defined
    app.whatever(); <-- this is in scope
};

backend.prototype.getCustomers = function(){
    //do some ajax and return a promise
};
return backend;

});

define([backend], function(backend){

return {
    customers:ko.observableArray([]),
    activate:function(){
        var that = this;
        var service = new backend('username', 'password');

        return service.getCustomers().then(function(results){
            that.customers(results);
        });
    }
};

});

Someothermodule:

define([], function(){

var whatever = function(){
    alert("whatever");
};

return {
    whatever: whatever
};

});

Tyler
  • 1,019
  • 12
  • 27

1 Answers1

0

index in the example above has two issues. a) in define [backend] is used instead of ['backend'] and b) ko is used without defining it. Both probably copy/paste errors.

Assuming that someothermodule lives in the same directory as index.js it's sufficient to define it like

define(['./someothermodule', ...], function( someothermodule, ... ) 

Here's the complete example:

backend.js

/*globals define*/
define(['./someothermodule', 'durandal/app', 'jquery'], function( someothermodule, app, $ ) {
    "use strict";
    var backend = function( username, password ) {
        this.username = username;
        this.password = password;
        this.whatever = someothermodule.whatever();
        app.trigger('whatever', this.whatever);
    };

    backend.prototype.getCustomers = function() {
        //do some ajax and return a promise
        return $.getJSON('app/so/19551060/fixtures/customer.json');
    };
    return backend;
});

someothermodule.js

/*globals define*/
define(function(){
    "use strict";
    var whatever = function(){
        return 'whatever return value';
    };

    return {
        whatever: whatever
    };
});

index.js

/*globals define*/
define(['./backend', 'knockout'], function(backend, ko){
    "use strict";
    return {
        customers:ko.observableArray([]),
        activate:function(){
            var that = this;
            var service = new backend('username', 'password');

            return service.getCustomers().then(function(results){
                that.customers(results);
            });
        }
    };
});

Live version available at: http://dfiddle.github.io/dFiddle-2.0/#so/19551060

RainerAtSpirit
  • 3,723
  • 1
  • 17
  • 18
  • Your right, it does work, I must of fixed a script error or something because it working in my project now. Thanks for the help. – Tyler Oct 24 '13 at 23:33