RequireJs - Define vs Richiedi

Question

Per i moduli non restituisco un oggetto che ho utilizzato richiedono invece di definire. Per esempio dire che ho il seguente plugin per jQuery (jquery.my-plugin.js):

require(['jquery'], function($) { 
    $.fn.myPlugin = function(options) { 
     ... 
    }; 
}); 

Ora, se io dico quanto segue in un altro modulo:

require(['jquery', 'jquery.my-plugin'], function($) { 
    $('#element').myPlugin(); 
}); 

ho trovato questo doesn' t lavoro perché myPlugin non è stato registrato. Tuttavia, se cambio il requisito in un define nel mio modulo jquery.my-plugin, allora funziona bene.

Apprezzerei se qualcuno potesse chiarire perché devo farlo. Mi piace capire completamente qualcosa prima di andare avanti e usarlo. Grazie

Answer 1

In sostanza, quando si utilizza require si sta dicendo "lo voglio, ma voglio anche tutte le sue dipendenze". Quindi nell'esempio seguente, richiediamo A, ma è necessario che cercheremo tutte le dipendenze e assicuriamo che vengano caricate prima di continuare.

require(['a'], function(a) { 
    // b, c, d, e will be loaded 
}); 

// File A 
define(['b','c','d','e'], function() { 
    return this; 
}); 

regola generale è di usare define quando si vuole definire un modulo che verrà riutilizzato dalla vostra applicazione e si utilizza require per caricare semplicemente una dipendenza.

Answer 2

seguito è il codice che deve essere all'interno jquery.my-plugin.js che definisce un modulo chiamato 'jquery.my-plugin' che può essere usato come una dipendenza altrove.

define(['jquery'], function($) { //jquery is a dependency to the jquery.my-plugin module 
    $.fn.myPlugin = function(options) { //adds a function to the *global* jQuery object, $ (global since jQuery does not follow AMD) 
     ... 
    }; 
}); 

Qui di seguito è una sezione di codice in cui si desidera collegare la funzione plugin per jQuery all'oggetto globale e quindi utilizzarlo ...

require(['jquery.my-plugin'], function() { // jquery.my-plugin is loaded which attaches the plugin to the global JQuery object as shown above, then this function fires 

    //the only reason $ is visible here is because it's global. If it was a module, you would need to include it as a dependency in the above require statement 
    $('#element').myPlugin(); //the $ refers to the global object that has the plugin attached 
});