0

私の場合、RequireJS は約半分の時間で機能します。ページを更新すると、負荷の問題がランダムに発生します。

私はそれを使用するために小さな MVC プロジェクトを適応させ、次のようなことをしています: RequireJS は複数のページと部分ビューでどのように機能しますか?

main _layout.cshtml からの読み込みを行う共通の main.js があります。上記の手法を使用するウィジェットやその他の場所の他の部分ビュー。以下の例は、私のサインイン ページからのものです。

<script type="text/javascript">
    require(["jquery", "kendo", "domReady!"], function ($, kendo) {        

        $("#signInForm").kendoWindow({
            draggable: false,
            width: "500px",
            modal: true,
            title: "Sign In",
            resizable: false
         });        
    }); 
</script>

Chrome は、main.js (パス マッピングとその他の構成が定義されている場所) の前にインライン スクリプトを読み込んで処理することがあるようです。「domReady」を要求しても違いはありません。

このスクリプトを、require.js と main.js が実行されるまで待機させるにはどうすればよいですか?

理想的とは言えないフォールバックは、jQuery をそのグローバル スコープに戻し、何らかのカスタム イベントを使用することです。もっと良いアイデアはありますか？または、RequireJS に組み込まれている方法はありますか?

更新:これは、_layout.cshtml で現在使用している回避策です。

<script src="@Url.Content("~/Scripts/jquery-1.7.2.min.js")" type="text/javascript"></script>
<script type="text/javascript">
    function requireIt(requirements, callback) {
        if ($(document).data("requireReady") === true) {
            require(requirements, callback);
        } else {
            $(document).bind("requireReady", null, function () {
                $(document).data("requireReady", true); 
                require(requirements, callback);
            });
        }
    }
</script> 
<script data-main="/scripts/main" src="@Url.Content("~/Scripts/require.js")" type="text/javascript"></script>

jQuery はグローバル フィクスチャに戻り、インライン スクリプトを含む部分ビューはこの requireIt ラッパーを使用します。そして、main.js が requireReady をトリガーします。

4

2 に答える 2

1

ジョナスの答えに続いて、何日もいじって、_Layout.cshtmlからこれを行う唯一の方法は次のとおりであることがわかりました(スクリプトタグはヘッダーにあります)。また、さまざまなチュートリアルの本文にスクリプト タグが表示されていますが、これは機能していないようです。

<script type="text/javascript" src="~/js/lib/require.js"></script>
        <script type="text/javascript">
            require.config({
                baseUrl: 'js/lib',
                paths: {
                    jquery: 'jquery-1.8.2',
                    kendo: 'kendo.all-2012.2.913.min',
                    underscore: 'underscore.min',
                    backbone: 'backbone.min',
                    app: '../app'
                },
                shim: {
                    underscore: {
                        exports:'_'
                    },
                    Backbone: {
                        deps: ['jquery', 'underscore'],
                        exports: "Backbone"
                    }
                }
            });            
        </script>

main.js への参照が機能しない理由がわかりません (そのため、_Layout.cshtml から削除しました)

<script data-main="js/main.js" src="~/js/lib/require.js" type="text/javascript"></script>

また、dox に従って js フォルダーのレイアウトを簡素化しました。

website
.....js
.....js/lib
.....js/lib/jquery-1.8.2.js
.....js/lib/underscore.js
.....etc
.....js/app
.....js/app/myscript.js
.....etc

お役に立てれば

ジェレミー

于 2012-10-13T14:47:34.073 に答える
1

これはrequire.js Webサイトで見つけました：

理想的には、ロードするスクリプトは、define() を呼び出すことによって定義されるモジュールになります。ただし、define() を介して依存関係を表現しない、従来の/レガシーの「ブラウザー グローバル」スクリプトを使用する必要がある場合があります。それらについては、シム構成を使用できます。依存関係を適切に表現するため。

シム構成ドキュメントへのリンク

依存関係を表現しない場合、RequireJS は速度のためにスクリプトを非同期に順不同でロードするため、ロード エラーが発生する可能性があります。

詳細については、require.js のドキュメントのポイント 1: JavaScript ファイルを読み込むを参照してください。

今は時間がないので、今夜試してみます。しかし、それが私の問題を解決するとイメージできるので、おそらくあなたの問題も解決します。

于 2012-08-09T09:37:53.393 に答える