6

(function($))( $.fn.myplugin = { ... } )(jQuery);jquery を、標準の Closure:を使用して定義された、amd 非対応の標準の jquery プラグインと一緒に使用したいとしますjs/libs/jquery/jquery.myplugin.js。

私はこの設定を使用します：

require.config({
  baseUrl: 'js/',
  paths: {
    'jquery':          'libs/jquery/jquery-noconflict', 
    'underscore':      'libs/underscore/underscore',
    'backbone':        'libs/backbone/backbone',
    'jquery-myplugin': 'libs/jquery/jquery.myplugin'
  },
  shim: {
    'backbone': {
      deps: ['underscore', 'jquery'],
      exports: 'Backbone'
  },
  'jquery-myplugin': {
    deps:  ['jquery'] 
  }
});

libs/jquery/jquery-noconflict.jsグローバル名前空間を汚染したくないので、jQuery を非競合モードでロードします。

define(['libs/jquery'], function () {
  return jQuery.noConflict(true);
});

これがメインの app.js をロードする方法です。

define([
  'jquery',
  'underscore',
  'backbone',
  'jquery-myplugin'],
function($, _, Backbone, MyPlugin){
  //MyPlugin is always undefined, not even sure if 
  //I should be passing it here if it only extends jQuery?
});

さて、ここで私が経験している問題があります。上記で定義されたすべてのライブラリを問題なく使用できますが、shimAMD 対応でない jquery プラグインをロードするための正しい構成を見つけることができませんでした。

現在（およびその逆）の設定を試みましたjquery-mypluginが、機能させることができませんでした。depsjquery

次のシナリオに問題があるようです。

  1. jQuery は非競合モードで読み込まれます。
  2. プラグイン コードが実行され、上記の jQuery のインスタンスが拡張されます
  3. アプリケーション内で $ をプラグイン コードで拡張して使用できるため、$.myplugin を使用できます。

同様の質問が浮かんでいるのを見たことがありますが、実際にこの問題を解決するものはなく、「シム構成を使用する」などの漠然とした提案しかありません...

編集

私も使ってみました

"jquery-myplugin": {
    deps: ["jquery"],
    exports: "jQuery.fn.myplugin"
}

この方法で AMD モジュールとしてロードされると、プラグイン メソッドが利用可能になりますが、アクセスできません$('.class').myplugin()。

4

3 に答える 3

3

を使用すると、グローバル変数jQuery.noConflict(true)が削除されます。jQueryプラグインが読み込まれると、 にアクセスしようとしますjQueryが、アクセスできないため、この失敗が発生します。

プラグインがモジュールの場合、依存関係として jQuery にアクセスできます。またはjQuery、グローバルとして利用可能のままにすることもできます。

于 2013-01-11T18:30:40.457 に答える
-1

まず、「path/to/jquery-myplugin」が実際に拡張されているwindow.jQueryことを確認します。$

noConflict() はwindow.jQueryオブジェクトを定義したままにしますが、それ自体をアンバインドしwindow.$ます 一部の新しいブラウザーwindow.$では、ネイティブdocument.querySelectorAll関数のエイリアスが組み込まれています。

次に、myplugin は単独では使用できないため、それ自体を返す必要はありません。jQuery を拡張しているので、myplugin 呼び出しから jQuery を返します。

最後に、「path/to/jquery-myplugin」はモジュールではありません。普通のJSファイルです。RequireJS がモジュールのようにロードしようとして、define()呼び出しが見つからない可能性があり、混乱につながります。実際に参照に「.js」ファイル拡張子を追加して、「js!」を使用する必要があることを RequireJS に通知してみてください。リソースをロードするためのプラグイン。

require.config({
    paths: {
        "jquery": "path/to/jquery",
        "jquery-myplugin": "path/to/jquery-myplugin.js"
    },
    shim: {
        "jquery": {
          init: function() {
             return window.jQuery.noConflict();
          },
        "jquery-myplugin": {
          deps: ['jquery']
          init: function($) {
             return $;
          },
       }
    } 
});
于 2013-01-12T20:42:43.817 に答える