CodeMoose
CodeMoose

Reputation: 3025

Cross-access of modules using require.js?

I'm developing a game for a client, and I'm running into some difficulty using require. I just split my code into two main files, game.js and gui.js, and they don't seem to have mutual access to each other.

Whichever module I define first seems to have access to the second - but the second doesn't have access to the first.

This is my main.js:

requirejs.config({
    paths: {
        jquery: [
            'http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min',
            'libs/jquery.min',
        ],
        //libraries
        kinetic:    'libs/kinetic.min',
        gui:        'gui',
        game:       'game'
    },
    shim: { 
        'gui':      ['jquery', 'kinetic'],
        'game':     ['jquery', 'kinetic']
    }

});
require([
    'jquery', 'kinetic', 'gui', 'game'
], function($, Kinetic, Gui, Game) {
    $(function(){
        Gui.init();
        Game.init();
    });
});

In this case, gui.js can access Game - but game.js sees Gui as undefined. If I try to shim Gui into Game, require dishes a timeout.

My game.js defines Gui:

define([
    "jquery",
    "kinetic",
    "gui"
], function($, Kinetic, Gui){ ... });

And my gui.js defines Game:

define([
    "jquery",
    "kinetic",
    "game"
], function($, Kinetic, Game){ ... });

I'm new to require, so I'm sure I'm just doing something wrong. How can I give game.js and gui.js access to each other? Let me know if you need any more info.

Upvotes: 0

Views: 89

Answers (1)

Nikos Paraskevopoulos
Nikos Paraskevopoulos

Reputation: 40298

You have a circular dependency: guigamegui. This is problematic.

Take a look at the docs of RequireJS on this matter: http://requirejs.org/docs/api.html#circular

Better yet, break the circular dependency. Here is a nice article, you will probably find others as well: http://misko.hevery.com/2008/08/01/circular-dependency-in-constructors-and-dependency-injection/

Upvotes: 2

Related Questions