RequireJs - Define vs Require

Question

Dla modułów nie zwracam obiektu, którego używam wymaga zamiast zdefiniować. Na przykład, że mam następujący jQuery plugin (jquery.my-plugin.js):

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

Teraz, jeśli powiem, co następuje w innym module:

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

Znalazłem to robi” t działa, ponieważ myPlugin nie został zarejestrowany. Jednak jeśli zmienię wymagania do definicji w moim module jquery.my-plugin, to działa dobrze.

Byłbym wdzięczny, gdyby ktoś mógł wyjaśnić, dlaczego muszę to zrobić. Chciałbym w pełni zrozumieć coś, zanim pójdę do przodu i go wykorzystam. Dzięki

Answer 1

Zasadniczo, kiedy używasz require, mówisz "chcę tego, ale chcę też wszystkie jego zależności". Tak więc w poniższym przykładzie wymagamy A, ale wymagamy, aby wyszukać wszystkie zależności i upewnić się, że są one załadowane przed kontynuowaniem.

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

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

ogólną regułą jest korzystanie define gdy chcesz zdefiniować moduł, który będzie ponownie wykorzystany przez aplikację i użyć require po prostu załadować zależność.

Answer 2

Poniżej znajduje się kod, który powinien znajdować się wewnątrz jquery.my-plugin.js który definiuje moduł o nazwie „jquery.my-plugin”, które mogą być używane jako zależność gdzie indziej.

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

Poniżej znajduje się fragment kodu, w którym chcesz dołączyć swoją funkcję wtyczki do globalnego obiektu jQuery, a następnie użyć go ...

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