1

たとえば、自分のサイトで使用したい優れた jQuery プラグインを誰かが作成したとしますが、それは AMD ではありません。それをrequireJSに追加するにはどうすればよいですか? デモ目的で、このプラグインが「codeFormatter」と呼ばれ、任意の<pre>タグを取り、各行がインデックスを取得するようにフォーマットします。そして明らかに、コードフォーマッターが機能するには jQuery が必要です。

codeFormatter を追加する前に<pre>、私のページに次のようなセクションがあるとしましょう:

var foo = function() {
    console.log("foo");
}

そして、この jQuery コードフォーマッターが呼び出され、(伝統的に) 起動されるとしましょう:

<script src="scripts/lib/jquery.js"></script>
<script src="scripts/codeformatter.js"></script>
<script>
    $("pre").codeFormatter();
</script>

codeFormatter を追加した後:

1. var foo = function() {
2.     console.log("foo");
3. }

とにかく、この codeFormatter.js プラグインは github に保存されているなど、リモートで他の誰かによって維持されているため、コードをコピーしてからdefine()メソッドを使用しても意味がありません。

shim、define、requireなどを使用してcodeFormatter.jsをrequireJSに入れるためのベストプラクティスは何ですか?

4

2 に答える 2

0

プラグインのサイズが小さい場合は、複数のプラグインを 1 つの JS ファイルに連結し、jQuery の後にロードすることをお勧めします。

プラグインが大きなファイル (jquery-ui など) であり、それらを連結したくない、または CDN からプルしたくない場合、次のように名前付き定義を定期的にロールします。

<script src="path/to/amd_loader.js"></script>
<script src="path/to/jquery.js"></script>
<script>

define(
    'jqueryplugins'
    , [
        'jquery'
        , 'js!plain/js/fileA.js' // loading through "js" plugin
        , 'actually/an/amd/compatible/module'
        , 'js!plain/js/fileB.js' // loading through "js" plugin
    ]
    // because plugins AUGMENT $, no point returning them separately
    // just return back the augmented jQuery reference.
    , function($){return $} 
)

</script>
...
<script>

require(
    ['jqueryplugins', 'path/to/mycode']
    , function($, mycode){
        mycode($)
    }
)

</script>

jQuery は AMD モジュールですが、AMD ローダーを介した初期フェッチは気にしません。それ自体を名前付きモジュールとして登録し、後で使用するだけです ( https://stackoverflow.com/a/14298476/366864を参照)。これにより、複雑な設定が不要になりshimますpath。jQuery のプリロードを手動で注文しない場合は、他の方法でプラグインの前に jquery のロードを注文する必要があることに対処する必要があります。

于 2013-01-15T20:12:24.793 に答える
0

あなたの要件は非常に一般的なものです。そのため、RequireJS ドキュメントで jQuery プラグインの概要が詳しく説明されています。shim詳細については、構成オプションをお読みください- http://requirejs.org/docs/api.html#config-shim

于 2013-01-15T10:56:21.693 に答える