31 votes

Chargement de jQuery, Underscore et Backbone à l'aide de RequireJS 2.0.1 et de shim

Je suis expérimenter un peu avec RequireJS 2.0.1. Mon but est de charger correctement jQuery, le trait de Soulignement et de la colonne vertébrale. À partir de l'original RequireJS doc , j'ai découvert que l'auteur J. Burke ajouté (à cette nouvelle version) une nouvelle option de configuration appelé la cale.

Ensuite, j'ai écrit ce genre de choses ici-bas:

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>Testing time</title>
        <script data-main="scripts/main" src="scripts/require.js"></script>
    </head>
    <body>
        <h1>Testing time</h1>
    </body>
</html>

scripts/main.js

requirejs.config({
    shim: {
        'libs/jquery': {
            exports: '$'
        },
        'libs/underscore': {
            exports: '_'
        },
        'libs/backbone': {
            deps: ['libs/underscore', 'libs/jquery'],
            exports: 'Backbone'
        }
    }
});


define(
    ['libs/jquery', 'libs/underscore', 'libs/backbone'],

    function (jQueryLocal, underscoreLocal, backboneLocal) {
        console.log('local', jQueryLocal);
        console.log('local', underscoreLocal);
        console.log('local', backboneLocal);
        console.log('global', $);
        console.log('global', _);
        console.log('global', Backbone);
    }
);

Tout semble fonctionner assez bien, mais j'ai le sentiment qu'il me manque quelque chose, je sais qu'il y a AMDed version de jQuery et le trait de Soulignement, mais si l'installation est si simple que je ne comprends pas pourquoi je devrais utiliser.

Est-ce que le programme d'installation à droite ou il me manque quelque chose?

32voto

jrburke Points 5361

Vous avez seulement besoin d'utiliser de "shim" config si la bibliothèque n'a pas déjà appel define() à déclarer un module. jQuery fait déjà, de sorte que vous pouvez le retirer à partir de la cale de config. Le code ci-dessus fonctionne comme il est, mais les exportations cale config pour jQuery sera ignorée depuis jQuery appellera define() avant de la cale travail est fait.

Les inconvénients avec la cale vs avoir l'appel du script define() pour définir un module:

  1. Il est moins portable/fiable: chaque développeur doit faire la cale de config, et de garder trace des modifications de bibliothèque. Si la bibliothèque de l'auteur est-il en ligne dans la bibliothèque, tout le monde reçoit les prestations de manière plus efficace. Les modèles de code à umdjs/umd peut aider avec ce changement de code.

  2. Moins un code optimal de chargement: cale de config des œuvres de chargement de la cale deps avant le chargement de la bibliothèque actuelle. C'est donc un peu plus séquentielle de chargement que parallèle. Il est plus rapide si tous les scripts peuvent être chargés en parallèle, ce qui est possible lorsque l' define() est utilisé. Si vous faites un build/optimisation pour la finale de déploiement et de combiner tous les scripts dans un script, alors ce n'est pas vraiment un inconvénient.

8voto

hapticdata Points 161

Ce que vous faites est correct, mais jQuery n'a pas besoin d'être dans la cale config car elle exporte une AMD (Asynchronous Module Definition) du module. Trait de soulignement supprimé son soutien pour AMD / Require.js rapidement après l'ajout d'elle, voir: Pourquoi underscore.js supprimé le support pour les processeurs AMD

La cale est conçu comme une commodité pour l'utilisation de bibliothèques qui n'exportent pas un AMD module. Si la bibliothèque que vous utilisez prend en charge de la DMLA, ou a 2 versions (l'une qui prend en charge AMD, et qui est une variable globale), vous devez utiliser la version pour les processeurs AMD. Vous devez utiliser la version pour les processeurs AMD pour les mêmes raisons que vous utilisez AMD, en premier lieu, et aussi parce que la bibliothèque peuvent inclure require.js (ou d'Amande ) dans sa source et serait augmenter inutilement la taille du fichier de votre projet.

0voto

Claudijo Points 252

Pouvez-vous réellement éviter "shimming" jquery dans l'exemple d'origine (où le chemin d'accès à jquery est défini sur 'libs / jquery'), puisque jquery ajoute le nom "jquery" dans la définition de leur module amd?

define (" jquery ", [], function () {return jQuery;});

D'après mon expérience, vous devez placer jquery.js dans le répertoire baseurl pour obtenir le module jquery amd défini comme prévu, ou "shim" comme dans l'exemple d'origine.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X