2013-10-03 3 views
5

Ich richte einen Weg für mich, meine bevorzugte requireJS Arbeitsweise zu halten und diese mit Wordpress zu integrieren.Verwendung von requireJS in Wordpress

Das große Problem ist, wie dann jquery zu laden. Wordpress lädt jQuery über wp_enqueue_script, was so bleiben muss, da einige Wordpress-Plugins, die ich regelmäßig verwende, jquery brauchen, um auf diese Weise hinzugefügt zu werden. Ich möchte dann keine zweite Version von jQuery in meinem requireJS-Setup laden. Also, nach, um diese einige suchen ist, was ich habe kommen mit:

templates/footer.php

<script> 
if (typeof jQuery === 'function') { 
    define('jquery', function() { return jQuery; }); 
} 

require(['/assets/js/sample-common.js'], function (common) { 
    require(['sample-bootstrapper']); 
}); 
</script> 

Welche sieht, wenn jQuery bereits auf der Seite hinzugefügt worden ist, wenn es es wird dann legt es als Modulwert fest.

Meine Frage ist, sollte ich dann jquery nur verlassen, um in den globalen Namensraum zu sein, oder gehen Sie folgendermaßen vor:

http://requirejs.org/docs/jquery.html#noconflictmap

Das Problem mit dem oben ist ich wahrscheinlich Jquery Plugins enthalten müssen, die aren 'AMD-kompatibel, lohnt es sich, AMD kompatibel zu machen, oder eine andere Lösung, die ich in Betracht gezogen habe, ist das Entfernen der True von der noConflict-Deklaration, die die' jQuery 'im globalen Namespace hält, damit die Plugins funktionieren können.

Dies ist weniger eine Frage und mehr eine Aufforderung zur Best Practice Beratung. Und jeder würde sehr geschätzt werden!

Danke!

+0

Ich denke, Sie müssen immer noch "Jquery" in Ihrem erfordern, zusätzlich zur Definition nein? – WraithKenny

Antwort

0

WordPress fügt jQuery ein, weil es ein Skript ist, sollten Sie dasselbe für Ihre eigenen Skripte tun, weil es bedeutet, dass WordPress die Abhängigkeiten für Sie elegant handhaben kann. Beachten Sie auch, dass WordPresss Bundle jQuery bereits im noConflict()-Modus geladen ist, um Plugin-Konflikte zu vermeiden.

Wenn Sie jQuery als eine der Abhängigkeiten des Skripts angeben, fügt WordPress es zu jeder Seite hinzu, die das Skript hinzufügt, das davon abhängt - aber nur, wenn es noch nicht geladen wurde (es wird nicht hinzugefügt zweites Mal).

UPDATE: Gemäß @brasofilo Kommentar die get_stylesheet_directory() Funktion sucht Kind und dann Eltern, wenn nichts passendes in dem Kind existiert. Sicher zu verwenden get_stylesheet_directory() in beiden Eltern und Kind Themensituationen.

von WP codex Genommen und geändert: http://codex.wordpress.org/Function_Reference/wp_enqueue_script

/** 
* Proper way to enqueue scripts and styles 
*/ 
function theme_name_scripts() { 
    wp_enqueue_script('script-name', get_template_directory_uri() . '/assets/js/sample-common.js', array('jquery'), '1.0.0', true); 
} 

add_action('wp_enqueue_scripts', 'theme_name_scripts'); 

Es ist erwähnenswert, dass, wenn Ihr Skript in einem untergeordneten Themenverzeichnis ist, dann sollten Sie get_template_directory_uri() tauschen und ersetzen sie durch get_stylesheet_directory_uri().

+1

'get_stylesheet_' sucht nach Kind und wenn nicht, sucht nach Eltern, dh, kann in jedem Fall sicher verwendet werden. – brasofilo

+0

Vielleicht sollte das im Abschnitt über den '$ src'-Paramiter in der Codex-Seite, die ich verlinkt habe, erwähnt werden ... Danke, dass du @brasofilo darauf hingewiesen hast :) –

+1

Danke für deine Antwort William. Ich verstehe, dass ich wahrscheinlich für alle meine Skript laden wp_enqueue_script bleiben sollte, aber ich würde lieber requireJS bleiben, weil das ist, wie ich außerhalb von Wordpress Code und wie ich meine Vorlagen vor der Integration in WP ich möchte nicht umgestalten meine Code zum Einpassen. – FlimFlam