Comment mixer des plugins Underscore dans RequireJS?

Question

Quelle est la bonne façon d'exécuter du code sur Underscore quand il est chargé? Je suis en train d'exécuter le code ci-dessous pour étendre l'espace de noms _ exporté automatiquement lorsque les modules exigent:

_.mixin(_.str.exports()); 

Les documents sont un peu vague, mais je pense que je l'ai mis dans la section init cale? J'ai essayé le même ci-dessous, mais je ne peux pas obtenir un point d'arrêt à frapper dans init:

require.config({ 
    paths: { 
     jquery: 'libs/jquery/jquery.min', 
     underscore: 'libs/underscore/lodash.min', 
     underscorestring: 'libs/underscore/underscore.string.min' 
    }, 

    shim: { 
     underscore: { 
      exports: '_' 
     } 
     underscorestring: { 
      deps: ['underscore'], 
      init: function (_) { 
       //Mixin plugin to namespace 
       _.mixin(_.str.exports()); 

       return _; 
      } 
     } 
    } 
}); 

Lorsque je tente de le faire et utiliser underscorestring, je reçois cette erreur:

Uncaught TypeError: Object function s(e){return new o(e)} has no method 'startsWith'

Docs:

• http://requirejs.org/docs/api.html#config-shim
• http://requirejs.org/docs/api.html#config-callback

Answer 1

Je ne sais pas si c'est la bonne façon, mais je l'ai eu de travail en inversant les choses afin que underscore dépend underscore.string . De même, vous n'avez pas besoin de souligner underscore.string.

require.config({ 
    shim: { 
    'backbone': { 
     deps: ['underscore', 'jquery'], 
     exports: 'Backbone' 
    }, 
    'underscore': { 
     deps: ['underscore.string'], 
     exports: '_', 
     init: function(UnderscoreString) { 
     _.mixin(UnderscoreString); 
     } 
    } 
    }, 
    paths: { 
    'backbone'   : 'lib/backbone', 
    'jquery'   : 'lib/jquery/jquery', 
    'text'    : 'lib/require/text', 
    'underscore'  : 'lib/underscore', 
    'underscore.string' : 'lib/underscore.string' 
    } 
}); 

.

Mise à jour: 3/14/2014

Underscore.js v1.6.0 ramené la compatibilité AMD et init() a été retiré de RequireJS, de sorte que certains refactorisation est en ordre. Pour continuer à obtenir Underscore préchargé avec Underscore.string j'ai fait un module de mélangeur pour les rassembler.

_{New Require.js config}

requirejs.config({ 
    paths: { 
    'backbone'   : '../lib/backbone/backbone', 
    'backbone.base'  : '../lib/backbone/backbone.base', 
    'backbone.extensions' : '../lib/backbone/backbone.extensions', 
    'jquery'    : '../lib/jquery/jquery', 
    'text'    : '../lib/require/text', 
    'underscore'   : '../lib/underscore/underscore', 
    'underscore.mixed' : '../lib/underscore/underscore.mixed', 
    'underscore.string' : '../lib/underscore/underscore.string' 
    }, 
    shim: { 
    'backbone.base': { 
     deps: ['underscore.mixed', 'jquery'], 
     exports: 'Backbone' 
    }, 
    } 
}); 

_{underscore.mixed}

define([ 
    'underscore', 
    'underscore.string' 
], function(_, _s) { 
    _.mixin(_s.exports()); 
    return _; 
}); 

L'étape finale consiste à remplacer toutes les instances de 'underscore' avec 'underscore.mixed' dans les définitions de modules. J'ai essayé de déplacer Underscore dans un fichier nommé underscore.base.js et de faire le underscore habituel du mélangeur (comme le programme Backbone) pour éviter cette étape. Souligné, étant un nommé module, en désaccord avec le plan.

Answer 2

Avez-vous besoin underscorestring quelque part? Parce que si ce n'est pas nécessaire, il ne sera pas chargé. j'ai réussi à le faire fonctionner avec le même code presque exactement que vous avez posté:

require.config({ 
    paths: { 
     underscore: [ 
      '//raw.github.com/documentcloud/underscore/master/underscore-min' 
     , 'lib/underscore' 
     ] 
    , underscorestring: 'https://raw.github.com/epeli/underscore.string/master/dist/underscore.string.min' 
    } 
, shim: { 
     underscore: { exports: '_' }, 
     underscorestring: { 
      deps: ['underscore'], 
      init: function(_) { 
       _.mixin(_.str.exports()); 
       return _; // guess, this is not needed. 
      } 
     } 
    } 
, exclude: ['underscore'] 
}); 

require(['underscore', 'underscorestring'], function(_) { 
    console.log(_.chars("i'm a happy string.")); 
}); 

Answer 3

Luttant avec cela pendant des heures avant que je comprends ce que je faisais mal

C'est ce que je l'ai fait mal

Vous ne devez pas renommer le fichier underscore.string dans le principal.js

même si dans ma bibliothèque, je l'ai fait renommer le fichier dans les chemins i Nom de nouveau à « underscore.string »

Voici comment votre main.js devrait ressembler à

require.config({ 
paths: { 
    underscore: 'lib/underscore', 
    'underscore.string' : 'lib/_string' , 
}, 
shim: { 
    underscore: { 
     exports: '_', 
     deps: [ 'jquery', 'jqueryui' ] 
    }, 
    'underscore.string': { 
     deps: [ 'underscore' ] 
    }, 
} 
.... 

vous pouvez alors soit ajouter comme dépendance avec votre shim comme je l'ai fait pour mon fichier mixin

shim: { 
    mixin : { 
     deps: [ 'jquery', 'underscore', 'underscore.string' , 'bootstrap' ] 
    }, 

Ou tout simplement définir dans vos différentes pages comme

/*global define */ 
define([  
    'underscore.string' 
], function () { 

il vous pouvez travailler tout à l'heure y accéder via _.str ou _.string

C'est pourquoi vous devriez le faire de cette façon et ne pas essayer de le nommer quelque chose d'autre

en ligne 663 de underscore.string.js

// Register as a named module with AMD. 
    if (typeof define === 'function' && define.amd) 
    define('underscore.string', [], function(){ return _s; }); 

Ce qui signifie qu'il ne l'enregistrer avec AMD besoin JS si vous définissez « underscore.string »

Pour Mix Vous pouvez simplement définir avec

/*global define */ 
define([  
    'underscore', 
    'underscore.string' 
], function () { 
    _.mixin(_.str.exports());