How can i access variables from my module built with requireJS?

Question

I have built a module foo which contains lines like:

MainModule.prototype = new Parent();
var bar = new MainModule();

the module was built with requirejs as it depended on a few other modules.

In my new module I want to be able to access some of my variables/functions in foo because they expose services that my new model wants access to so like:

require(["foo"], function(foo){
  console.log(foo, MainModule, bar)
})

I get "undefined" when i do this...i'm guessing it has to do with the fact that the variables MainModule and bar have been uglified in the build step. How can I prevent this from happening? Is there a way to specify variable names that must be preserved?

Michael Schock · Accepted Answer · 2014-01-10 05:34:54Z

3

Well, I'm not sure how foo is structured but MainModule and bar are probably local variables within foo. You could return them from foo such as:

define(function(require) {
    var MainModule = require('MainModule');
    var bar = new MainModule();
    var someFunction = function() {
        console.log('bar');
    };

    return {
        bar: bar,
        someFunction: someFunction
    }
});

And then you'll have access to the data returned:

require(["foo"], function(foo) {
    console.log(foo.bar);
    console.log(foo.someFunction());
})

answered Jan 10, 2014 at 5:34

Michael Schock

5755 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

algorithmicCoder Over a year ago

thanks will try to work of this. Why do you say MainModule = require('MainModule')? In my code MainModule is new Parent() where Parent is some other module. Also is passing in require a shortcut for passing in an array of dependencies as the first argument?

algorithmicCoder Over a year ago

OK so my problem is the minification...is it impossible to make minified modules?

Louis · Accepted Answer · 2014-01-10 12:12:51Z

The problem in the question has nothing to do with minification because the code shown in the question cannot work, with or without minification.

The issue is that the values that should be accessible outside the module must be exported. And outside the module they are accessible through the variable to which this module is bound by a require or define function.

To export values, you can return them from the factory function that is passed to define. (There are also other means to do this but I'm not going to get into them now.) Your foo.js file could be like this:

define(function () {

function Parent() {
}

function MainModule() {
}

MainModule.prototype = new Parent();
var bar = new MainModule();

// Here I'm exporting the values I want accessible outside.
return {
    MainModule: MainModule,
    bar: bar
};

});

I've obviously had to fill foo.js with the minimum amount of code to have something that would work.

Then you could have an index.html like this:

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/xhtml; charset=utf-8"/>
    <script type="text/javascript" src="js/require.js"></script>
  </head>
  <body>
    <script>
      require.config({
          baseUrl: "./js",
      });
      require(["foo"], function(foo){
          console.log(foo, foo.MainModule, foo.bar)
      });
    </script>
  </body>
</html>

and foo.js and RequireJS located in the js subdirectory (relative to index.html), you'll see on the console that foo, foo.MainModule, and foo.bar are defined. The require call loads the module named foo, which resolves to js/foo.js and binds the value returned by the module's factory to the first argument of the callback passed to require. In this case the name of this argument is foo. So in the callback,

foo is the whole module,
foo.MainModule has the value that MainModule has in the module foo.
foo.bar has the value that bar has in the module foo.

The last two bindings exist only because the module foo exports its values as shown above.

Collectives™ on Stack Overflow

How can i access variables from my module built with requireJS?

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related