18

サードパーティのサイトに機能を追加するために組み込むことを目的としたスクリプトを書いています。私は最近、かなり厄介なカスタムローダーコードを取り除いて、requirejsに置き換え始めました。オプションでロードされるライブラリの1つ(渡されたパラメータによって異なります)はjQueryです。

これは、jQueryが既に存在するページにスクリプトが含まれるまではうまく機能します。その場合、プラグインが途中で読み込まれ、requirejsがページのバージョンに対してjQueryを読み込み、プラグインがすぐに壊れます。

このスクリプトを使用するためだけにページを書き直すようにクライアントに依頼することは問題外です。したがって、jQueryが既にロードされているかどうかを検出し、ロードされている場合は、requirejsによるロードをスキップして、すでにロードされているものを使用します(これにより、はるかに古いバージョンのjQueryを使用している場合に、奇妙なエッジケースやバグが発生する可能性がありますが、選択肢はあまりありません)。

私がやろうと思ったのは、最初にjQueryがロードされているかどうかを確認する新しいモジュールを作成することです。ロードされている場合は、jQueryオブジェクトをエクスポートし、ロードされていない場合は、ロードしてからエクスポートします。ただし、モジュールの定義関数が機能するには同期である必要があるように見えるため、私は困惑しているように見えます。そのため、非同期になる別のスクリプトをロードして、エクスポートをrequirejsに詰め込むことはできません。

ドキュメントに何かが欠けていますか?私が試みていることは不可能ですか?

4

3 に答える 3

26

サードパーティのサイトにロードすることを目的としたライブラリにrequire.jsを使用して、同様のプロジェクトで同じ問題が発生しました。ここで私のアプローチを見ることができますが、簡略化されたバージョンは次のとおりです。

// check for existing jQuery
var jQuery = window.jQuery,
    // check for old versions of jQuery
    oldjQuery = jQuery && !!jQuery.fn.jquery.match(/^1\.[0-4](\.|$)/),
    localJqueryPath = libPath + 'jquery/jquery-1.7.2.min',
    paths = {},
    noConflict;

// check for jQuery 
if (!jQuery || oldjQuery) {
    // load if it's not available or doesn't meet min standards
    paths.jquery = localJqueryPath;
    noConflict = !!oldjQuery;
} else {
    // register the current jQuery
    define('jquery', [], function() { return jQuery; });
}

// set up require
require.config({
    paths: paths 
});

// load stuff
require(['jquery', ... ], function($, ...) {

    // deal with jQuery versions if necessary
    if (noConflict) $.noConflict(true);

    // etc

});

ご覧のとおり、これは jQuery を検索し、「jquery」モジュールを既存のライブラリのラッパーとして定義するか、(jQuery がない場合、または既存の jQuery が古いバージョンである場合) ライブラリ固有の jQuery をnoConflict.

これはかなりうまくいきます。唯一の欠点はrequire()、スクリプト内で動的に呼び出しているため、r.jsオプティマイザーを効果的に使用することがより困難になっていることです。

于 2012-09-04T17:05:53.427 に答える