Charger des fichiers dans un ordre spécifique, avec RequireJs

Je suis nouveau sur RequireJS et je suis coincé avec l'ordre de chargement.

J'ai un projet global de la configuration que j'ai besoin d'être chargé avant les modules situés en js/app/*.

Voici mon struture :

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

Voici l'config.js fichier :

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
};

Et voici mon requirejs fichier (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 ($) {});

Mais quelques fois, lorsque je charge la page, j'ai un "Projet" n'est pas défini, car login.js a été chargé AVANT config.js.

Comment puis-je la force config.js pour être chargé au premier abord, n'importe quoi ?

Remarque: j'ai vu order.js en tant que plugin pour RequireJS, mais c'est apparemment pas pris en charge depuis la v2, remplacé par shim.

Merci pour votre aide!

InformationsquelleAutor Cyril N. | 2012-07-20
  1. 15

    Vous n'aurez pas à vous soucier de l'ordre de chargement si vous définissez vos fichiers js que l'AMD modules. (Ou vous pouvez utiliser la cale de la configuration, si vous ne pouvez pas modifier l' config.js et login.js appeler define).

    config.js devrait ressembler à quelque chose comme ceci:

    define({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
}});

    login.js:

    define(['jquery', '../../config'], function($, config) {

    //here, config will be loaded
    console.log(config.project)

});

    De nouveau, cale config devrait être utilisé seulement en cas d'appel define() à l'intérieur des modules n'est pas une option.

    InformationsquelleAutor ekuusela
  2. 26

    A couru dans un problème similaire aujourd'hui - nous avons démarré les données que nous voulons nous assurer que est chargé avant tout autre chose, et que le module d'exposer des données est mis en place avant les autres modules sont évalués.

    La solution la plus simple que j'ai trouvé à force de l'ordre de chargement est de simplement exiger un module doit être chargé avant de continuer avec l'app initialisation:

    require(["bootstrapped-data-setup", "some-other-init-code"], function(){
    require(["main-app-initializer"]);
});
    • D'accord. J'ai seulement besoin pour atteindre cet temporairement pendant le processus de développement et était assez bon!
    • Peut même mettre les codes ci-dessus dans requirejs-config.js pour charger dans l'ordre.
    InformationsquelleAutor tomconnors
  3. 20

    Il y a une solution possible pour construire une file d'attente pour les modules à charger. Dans ce cas, tous les modules seront chargés un par un dans l'ordre exact:

    var requireQueue = function(modules, callback) {
  function load(queue, results) {
    if (queue.length) {
      require([queue.shift()], function(result) {
        results.push(result);
        load(queue, results);
      });
    } else {
      callback.apply(null, results);
    }
  }

  load(modules, []);
};

requireQueue([
  'app',
  'apps/home/initialize',
  'apps/entities/initialize',
  'apps/cti/initialize'
], function(App) {
  App.start();
});
    • De bon sens! merci. Avez-vous une idée si cela fonctionne dans le cas des modules en fonction imbriquée modules ?
    • Veuillez noter que la r.js optimiseur ne sera probablement pas payer aucune attention particulière à l'ordre, juste parce que l'app est avant apps/la maison ne signifie pas que, dans le final, minifiés concat fichier, le code source de l'application apparaîtra avant app/home... , la seule garantie est que ils sont tous de la charge avant le rappel
    InformationsquelleAutor fantactuka