web-dev-qa-db-fra.com

Est-il possible d'empêcher requireJS d'ajouter l'extension de fichier .js automatiquement?

J'utilise requireJS pour charger des scripts. Il a ce détail dans la documentation :

Le chemin utilisé pour un nom de module ne doit pas inclure le fichier .js extension, car le mappage de chemin pourrait être pour un répertoire.

Dans mon application, je mappe tous mes fichiers de script dans un chemin de configuration, car ils sont générés de manière dynamique au moment de l'exécution (mes scripts démarrent comme order.js mais deviennent tels que order.min.b25a571965d02d9c54871b7636ca1c5e.js (ceci est un hachage du contenu du fichier fins). 

Dans certains cas, require ajoutera une seconde extension .js à la fin de ces chemins. Bien que je génère les chemins dynamiques côté serveur, puis que je remplisse le chemin de configuration, je dois ensuite écrire du code javascript supplémentaire pour supprimer l'extension .js des fichiers problématiques.

En lisant les docs requireJS, je ne comprends vraiment pas pourquoi vous voudriez que le mappage de chemin soit utilisé pour un répertoire. Cela signifie-t-il qu'il est possible de charger d'une manière ou d'une autre les fichiers d'un répertoire entier en un seul appel? Je ne comprends pas.

Est-ce que quelqu'un sait s'il est possible d'imposer la nécessité d'arrêter d'ajouter .js aux chemins de fichiers afin que je n'ai pas à le pirater?

merci.

UPDATE: ajout de quelques exemples de code à la demande.

Cela se trouve dans mon fichier HTML (c'est un projet Scala, nous ne pouvons donc pas écrire ces variables directement dans un fichier .js):

foo.js.modules = {
    order               : '@Static("javascripts/order.min.js")',
    reqwest             : 'http://5.foo.appspot.com/js/libs/reqwest',
    bean                : 'http://4.foo.appspot.com/js/libs/bean.min',
    detect              : 'order!http://4.foo.appspot.com/js/detect/detect.js',
    images              : 'order!http://4.foo.appspot.com/js/detect/images.js',
    basicTemplate       : '@Static("javascripts/libs/basicTemplate.min.js")',
    trailExpander       : '@Static("javascripts/libs/trailExpander.min.js")',
    fetchDiscussion     : '@Static("javascripts/libs/fetchDiscussion.min.js")'
    mostPopular         : '@Static("javascripts/libs/mostPopular.min.js")'
};

Puis dans mon main.js:

requirejs.config({
    paths: foo.js.modules
});

require([foo.js.modules.detect, foo.js.modules.images, "bean"], 
    function(detect, images, bean) {
        // do stuff
});

Dans l'exemple ci-dessus, je dois utiliser la chaîne "bean" (qui fait référence au chemin requis) plutôt que mon objet direct (comme les autres utilisent foo.js.modules.bar), sinon j'obtiens le .js supplémentaire ajouté.

J'espère que cela a du sens.

javascriptrequirejs
50
Matt Andrews

requirejs ' noext plugin :

Charger des scripts sans ajouter l'extension ".js", utile pour les scripts dynamiques ...

Documentation

vérifiez le dossier examples. Toutes les informations dont vous aurez probablement besoin seront à l'intérieur de commentaires ou sur l'exemple de code lui-même.

Utilisation de base

Placez les plugins dans le dossier baseUrl (généralement le même dossier que le fichier main.js) ou créez un alias à l'emplacement du plugin:

require.config({
    paths : {
        //create alias to plugins (not needed if plugins are on the baseUrl)
        async: 'lib/require/async',
        font: 'lib/require/font',
        goog: 'lib/require/goog',
        image: 'lib/require/image',
        json: 'lib/require/json',
        noext: 'lib/require/noext',
        mdown: 'lib/require/mdown',
        propertyParser : 'lib/require/propertyParser',
        markdownConverter : 'lib/Markdown.Converter'
    }
});

//use plugins as if they were at baseUrl
define([
        'image!awsum.jpg',
        'json!data/foo.json',
        'noext!js/bar.php',
        'mdown!data/lorem_ipsum.md',
        'async!http://maps.google.com/maps/api/js?sensor=false',
        'goog!visualization,1,packages:[corechart,geochart]',
        'goog!search,1',
        'font!google,families:[Tangerine,Cantarell]'
    ], function(awsum, foo, bar, loremIpsum){
        //all dependencies are loaded (including gmaps and other google apis)
    }
);
13
jaketrent

Si vous ne souhaitez pas ajouter de dépendance à noext, vous pouvez également simplement ajouter une chaîne de requête factice au chemin afin d'empêcher l'extension .js d'être ajoutée, comme dans:

require.config({
    paths: {
        'signalr-hubs': '/signalr/hubs?noext'
    }
});

C'est ce que fait le plugin noext.

109
Chris Eldredge

J'utilise le côté serveur requirejs avec node.js. Le plugin noext ne fonctionne pas pour moi. J'imagine que c'est parce qu'il essaie d'ajouter? Noext à une url et que nous avons des noms de fichiers au lieu d'urls serveride.

Je dois nommer mes fichiers .njs ou .model pour les séparer des fichiers .js statiques. Espérons que l'auteur mettra à jour requirejs pour ne pas imposer aux utilisateurs les conventions d'extension automatique de fichier .js.

En attendant, voici un correctif rapide pour désactiver ce comportement.

Pour appliquer ce correctif (à la version 2.1.15 de node_modules/requirejs/bin/r.js):

  1. Sauvegarder dans un fichier appelé disableAutoExt.diff ou autre et ouvrir un terminal
  2. cd path/to/node_modules /
  3. patch -p1 <chemin/vers/disableAutoExt.diff
  4. ajoutez disableAutoExt: true à votre requirejs.config: requirejs.config ({disableAutoExt: true,});

Maintenant, nous pouvons faire besoin de (["test/index.njs", ...] ... et reprendre le travail.

Enregistrez ce correctif dans disableAutoExt.diff:

--- mod/node_modules/requirejs/bin/r.js 2014-09-07 20:54:07.000000000 -0400
+++ node_modules/requirejs/bin/r.js 2014-12-11 09:33:21.000000000 -0500
@@ -1884,6 +1884,10 @@
         //Delegates to req.load. Broken out as a separate function to
         //allow overriding in the optimizer.
         load: function (id, url) {
+            if (config.disableAutoExt && url.match(/\..*\.js$/)) {
+                url = url.replace(/\.js$/, '');
+            }
+
             req.load(context, id, url);
         },

Le correctif ajoute simplement ce qui suit autour de la ligne 1887 dans node_modules/requirejs/bin/r.js:

if (config.disableAutoExt && url.match(/\..*\.js$/)) {
    url = url.replace(/\.js$/, '');
}

UPDATE: Correctif amélioré en déplaçant le changement d'URL plus en profondeur dans le code afin qu'il ne provoque plus de blocage après l'appel d'undef sur un module. Nécessaire undef car:

Pour désactiver la mise en cache des modules lors du développement avec node.js, ajoutez ceci à votre fichier d'application principal:

requirejs.onResourceLoad = function(context, map)
{
    requirejs.undef(map.name);
};
0
hud