Load files in specific order with RequireJs

Viewed 28908

I'm new to RequireJS and I'm stuck with the loading order.

I have a global project configuration that I need to be loaded before the modules located in js/app/*.

Here's my struture :

index.html
config.js
js/
    require.js
    app/
        login.js
    lib/
        bootstrap-2.0.4.min.js

Here's the config.js file :

var Project = {
    'server': {
        'host': '127.0.0.1',
        'port': 8080
    },
    'history': 10,      // Number of query kept in the local storage history
    'lang': 'en',       // For future use
};

And here's my requirejs file (app.js) :

requirejs.config({
    //By default load any module IDs from js/lib
    baseUrl: 'js/lib',
    //except, if the module ID starts with "app",
    //load it from the js/app directory. paths
    //config is relative to the baseUrl, and
    //never includes a ".js" extension since
    //the paths config could be for a directory.
    paths: {
        bootstrap: '../lib/bootstrap-2.0.4.min',
        app: '../app',
    },
    shim: {
        'app': {
            deps: ['../../config'],
            exports: function (a) {
                console.log ('loaded!');
                console.log (a);
            }
        } // Skual Config
    },
});

var modules = [];
modules.push('jquery');
modules.push('bootstrap');
modules.push('app/login');


// Start the main app logic.
requirejs(modules, function ($) {});

But sometimes, when I load the page, I have a "Project" is undefined, because login.js has been loaded BEFORE config.js.

How can I force config.js to be loaded at first, no matter what ?

Note: I saw order.js as a plugin for RequireJS but it's apparently not supported since the v2, replaced by shim.

3 Answers
Related