1

AMD 以外のモジュールをシム構成で注文できません。

私のシム設定はこのようなものです。require-jquery.js を使用したい場合でも、AMD 以外の 2 つのモジュールは jquery ui と jqGrid になります。jqGrid 自体には、jqGrid がロードされている場合にのみロードする必要があるプラグインがいくつかあります。

requireconfig.js

require.config({
    baseUrl: '../jsp',
    paths: {
        app: '../js/app',
        jquerygrid: 'http://view.jqueryui.com/grid',
        lib: '../js/lib',
        plugins: '../js/plugins',
        jquery: '../js/lib/jquery-1.9.1',
        jqueryui: [ 'http://ajax.googleapis.com/ajax/libs/jqueryui/'+
            '1.9.2/jquery-ui'],
        canjs:  'http://canjs.us/release/latest/can.view.mustache',
        uigrid:'../js/plugins/mydataview',
        jqgrid: '../js/plugins/grid.locale-en'
    },
    shim: {
        jqueryui: {
            exports: "$",
            deps: ['jquery']
        },
        uigrid: {

            deps:[
             'jqueryui',    
             'http://view.jqueryui.com/grid/ui/jquery.ui.dataview.js',
             'http://view.jqueryui.com/grid/ui/jquery.ui.grid.js',
             'http://view.jqueryui.com/grid/ui/jquery.ui.observable.js',
             'http://view.jqueryui.com/grid/ui/jquery.ui.dataviewlocal.js',
             'http://view.jqueryui.com/grid/grid-spf/pager.js',
             'http://view.jqueryui.com/grid/grid-editing/grid.selectable.js',
             'http://view.jqueryui.com/grid/grid-editing/navigator.js',
             'http://view.jqueryui.com/grid/grid-editing/localstore.js',
             'http://view.jqueryui.com/grid/grid-editing/helpers.js',
             'http://view.jqueryui.com/grid/external/jquery.tmpl.js',
             'http://view.jqueryui.com/grid/grid-spf/grid-filter.js',
             'http://view.jqueryui.com/grid/grid-spf/grid-sort.js'
            ]
        },
        canjs:{
            deps: ['jquery','http://canjs.us/release/1.1.4/can.jquery.js']
        },
        jqgrid:['jqueryui','../js/plugins/jquery.jqGrid.src.js']
    }
});

そして、私の呼び出しHTMLは

<script type="text/javascript" src="../js/require.js"></script>
<script type="text/javascript" src="../js/requireconfig.js"></script>

<script type="text/javascript">
require(['jqgrid'], function($){
    $("#mygrid").jqGrid({
        pager: "#mygridpager"
    })
});
</script>

さまざまな実行で、さまざまなエラーが発生しています。

時々 ：

Uncaught ReferenceError: jQuery が定義されていません ..... jquery.jqGrid.src.js:3589

もちろん、これはエラーになりません。しかし、requirejs は順序をサポートしていないため、ハックのように見えます。ネストされた require 呼び出しもエレガントではありません。when().then() のように遅延された requirejs がある場合、チェーンのように見栄えが良くなる可能性があります。

<script type="text/javascript">
require(['jquery'], function(){
    require(['jqgrid'], function(){
        $("#mygrid").jqGrid({
            pager: "#mygridpager"
        });
    });
});
</script>
4

1 に答える 1

2

このサンプル フィドルでは、JS ファイルが RequireJS によって読み込まれるときにエラーは発生しません。

'../js/plugins/jquery.jqGrid.src.js'問題の核心は、ファイルが RequireJS によって読み込まれることだと思いますが、RequireJS はこのファイル自体に依存関係があることを認識していません。したがって、このファイルがロードされるとき、その依存関係はまだロードされていません。

そのため、どのモジュールが他のどのモジュールに依存しているかについて、RequireJS で完全に明示する必要がある場合があります。たとえば、パスとシムを追加します。

パス:

    jqgridlocale: 'http://www.trirand.com/blog/jqgrid/js/i18n/grid.locale-en',
    jqgrid: 'http://www.trirand.com/blog/jqgrid/js/jquery.jqGrid.min'

シム:

    jqgrid:{
        deps:['jqueryui','jqgridlocale']
    },
    jqgridlocale:{
        deps:['jqueryui']
    }

これで RequireJS は、jqgridとの両方(したがって) を最初にロードするjqgridlocale必要があることを認識します。jqueryuijquery

直接使用しているので、明示的にrequire()jQueryも使用します。コードを読むと、jQuery が直接使用されていることが分かります。

require(['jquery','jqgrid'], function($){
    $("#mygrid").jqGrid({
        pager: "#mygridpager"
    })
});
于 2013-03-31T19:45:24.687 に答える