5

I'm setting up a way for me to keep my preferred requireJS way of working and integrate this with Wordpress.

The big issue being how then to load jquery. Wordpress loads jQuery via wp_enqueue_script which needs to remain that way as some Wordpress plugins I regularly use need jquery to be added that way. I don't then want to load a second version of jQuery within my requireJS setup. So, after some looking around this is what I've come up with:

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>

Which sees if jQuery has already been added to the page, if it has been then it sets it as the module value.

My question is should I then just leave jquery to be in the global namespace, or follow these instructions:

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

The problem with the above is I will probably need to include jquery plugins that aren't AMD compatible, is it worth the effort to make them AMD compatible or another solution I thought about was removing the true from the noConflict declaration which keeps the 'jQuery' in the global namespace allowing the plugins to function.

This is less of a question and more of a call for best practice advice. And any would be much appreciated!

Thanks!

4

1 に答える 1

0

WordPress はスクリプトであるため、jQuery をエンキューします。WordPress が依存関係を適切に処理できることを意味するため、独自のスクリプトに対しても同じことを行う必要があります。noConflict()また、WordPress にバンドルされている jQuery は、プラグインの競合を防ぐモードで既に読み込まれていることにも注意してください。

スクリプトの依存関係の 1 つとして jQuery を指定すると、WordPress はそれに依存するスクリプトを追加するすべてのページに jQuery を追加しますが、まだ読み込まれていない場合に限ります (2 回目は追加されません)。

更新: @brasofilo コメントに従ってget_stylesheet_directory()、子に一致するものが存在しない場合、関数は子を検索し、次に親を検索します。get_stylesheet_directory()親テーマと子テーマの両方の状況で安全に使用できます。

WP codex から引用して変更: 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' );

ここで、スクリプトが子テーマ ディレクトリにある場合は、スワップ アウトしget_template_directory_uri()て に置き換える必要があることに注意してくださいget_stylesheet_directory_uri()。

于 2013-10-03T14:03:03.660 に答える