4

現在、さまざまな非同期リソースローダーをテストして、どれを使用したいかを確認しています。現在、Curlは「<strong>Promise は既に完了しています」というエラーをスローしており、ドキュメントには「これは決して起こらないはずです」と書かれています。

ロードされる各ファイル内で「define」を使用する必要があると「思います」(そうではないことを願っています)。さらに、彼らのドキュメントによると、Curl は AMD 以外の JavaScript ファイルで動作する可能性があります。しかし...私はAMDを初めて使用し、Curlは私がテストしている他のものよりもはるかに高速であるため...これをよりよく理解するために時間を割きたいと思います。

最後に...

FireBug はエラーを表示しますが、すべてのファイルはまだ非同期にロードされています! しかし、エラーがあるため...コードの ' then ' 部分が呼び出されることはありません。

だから私の質問は:

  • 「定義」に含まれるすべての JavaScript ファイル オブジェクトを更新する必要がありますか? (...そうではないことを願っています)
  • 構文的に他に問題はありますか?

ヘッドのコードは次のようになります。

<script type="text/javascript">
    ///<summary>Configuration</summary>
    curl = { baseUrl: 'Includes/JavaScript/' };
</script>
<script src="Loaders/Curl/curl.js" type="text/javascript"></script>
<script type="text/javascript">

    function onSuccess() {
    }
    function onError(ex) {
        //alert(ex);
    }

    require(["MooTools/Core/mootools-1.2.2-core-jm",
        "MooTools/mGeneral",
        "jQuery/Core/jquery-1.3.2",
        "jQuery/Core/jquery.tools.min",
        "jQuery/ThirdPartyPlugIns/jquery.tmpl"])
        .then(onSuccess, onError);

    //require(["jQuery/TopUp/top_up-min"], null);

    require(["jQuery/ThirdPartyPlugIns/jquery.dimensions",
        "jQuery/ThirdPartyPlugIns/jQuery.Color.Animations",
        "jQuery/ThirdPartyPlugIns/jquery.corners.min",
        "jQuery/ThirdPartyPlugIns/jquery.tipsy",
        "jQuery/ThirdPartyPlugIns/jquery.numberformatter-1.1.0",
        "jQuery/ThirdPartyPlugIns/jquery.tipsy"]);

    require(["general",
        "WindowCenter",
        "ThirdPartyPlugin/KeyBoardCapture",
        "ThirdPartyPlugin/bsn.AutoSuggest_2.1.3",
        "ee/8Ball",
        "ee/EE"]);
</script>

繰り返しますが...AMDスタイルのコードの経験不足が原因だと確信していますが、それでも助けが必要です...だから、どんなことでも大歓迎です。

4

2 に答える 2

1

通常、これらのモジュールに依存関係がない場合は、モジュールをでラップするか、ファイルの最後にをdefine()追加する必要があります。define()ただし、他のモジュール/ファイルではないにしても、これらのモジュールはすべてjQueryに依存しているようです。

標準のAMD require()/define()プロトコルを使用していないため、AMDはこれらのモジュールを実際に支援していません。を使用して独自のモジュールを作成する予定がない限りdefine()、ほぼすべての非同期ローダーを使用できます。

そうは言っても、curl.jsをAMD以外のモジュール/ファイルで動作させる方法があります。jsを使用してください!プラグイン。これが、jsを使用するように翻訳されたファイルの最初のブロックです!プラグイン(モジュール以外で実行したい「.js」extも追加したことに注意してください):

// we load the core files first, then get the next block that depends on them
curl([
    "js!MooTools/Core/mootools-1.2.2-core-jm.js",
    "js!jQuery/Core/jquery-1.3.2.js"
]).next([
    "js!MooTools/mGeneral.js",
    "js!jQuery/Core/jquery.tools.min.js",
    "js!jQuery/ThirdPartyPlugIns/jquery.tmpl.js"
]).then(onSuccess, onError);

各配列内のこれらのファイルのいずれかが相互に依存している場合は、それらに!orderサフィックスを使用して、実行/評価する前に他のファイルを待機するようにすることもできます(ただし、適切なキャッシュヘッダーを設定していることを確認してください)。実際には、キャッシュの問題がない限り、!orderサフィックスが最速の方法です(モバイルブラウザはファイルサイズにいくつかの追加の制約を追加します)。

他にエラーメッセージはありましたか?具体的には、curl.jsが「Promisenotcompleted」以外に少なくとも1つのエラーをスローすることを期待します。

また、[ネット]タブ(Firebug)または[ネットワーク]タブ(Chrome)をチェックして、curl.jsがモジュールの正しい場所を探していることを確認してください。

FWIW、エイリアスを削除する予定ですrequire-> curl。その理由は、グローバルrequire関数が非標準である(そしてAMDの提案では明示的に標準化されていない)ためです。curl()の代わりに使用することをお勧めしますrequire()

curl.jsでは、本当に「require」という名前を使用したい場合は、「apiName」構成パラメーターを介してトップレベルのAPIを明示的にエイリアス化することもできます。:)

<script>curl = { apiName: "require" }; </script>
<script src="path/to/curl.js"></script>
<script>require(["some/modules"]).then(success, failure);</script>

その他のFWIW:標準requireは通常、モジュールでのみ必要であり、依存関係として含めることで要求できます。

define(["require"], function (require) {
    require(["another/module"], function (another) {
        // use another module here
    });
});

-ジョン

于 2011-05-19T14:36:50.500 に答える
0

通常の javascript ファイルの読み込みのみを行っている場合 (モジュールではありません)、表示されるように、LABjs ( http://labjs.com ) を確認することをお勧めします。LABjs は、最もパフォーマンスが最適化されたローディング ソリューションであることに重点を置いています (モジュール/依存関係スタイルなどの他の機能を除外しています)。

実際、今後数日で完全にリリースされる LABjs 2.0a ( https://github.com/getify/LABjs/blob/master/next/LAB.src.js ) は、非常に高速です (さらに1.2 より) 一般的なスクリプトを並列にロードする場合。(John が上記を回避するように) モジュール構文に移行する予定がない限り、試してみることをお勧めします...その後は Curl または RequireJS を使用します。

于 2011-05-19T18:18:37.033 に答える