WebpackでAngular DirectiveにカスタムjQueryプラグインを使用する

Question

Webpackでディレクティブの要素に使用するカスタムjqueryプラグインが必要です。私はそれが働くと思ったやり方で実装を始めました。

// example.directive.js 

var customJQPlugin = require('./customJQPlugin.plugin'); 

... 

    link: function (scope, elem) { 
    angular.element(elem).customJQPlugin({ 
     some: 'options' 
    }); 
    } 

... 

これは、要素にプラグインを適用します。その後、

と（ディレクティブと同じディレクトリに）プラグインファイル

// customJQPlugin.plugin.js 

(function ($) { 

    $.fn.customJQPlugin = function (options) { 
    var el = this; 
    ... 
    } 

})(jQuery) 

私の質問はこれを行うための典型的な方法は何か、である、私は現在thisが定義されていないいくつかのエラーを持っている、とcustomJQPlugin is not a functionときチェーン接続されたangular.element(elem).customJQPlugin(options)

これは、Webpackがrequireという角度指示に適用されるようにjQueryプラグインファイルを構成する方法の詳細です。私は、IIFEはこれに必要ではないと確信していますが、Webpackのリファクタリング方法は不明です。

EDIT： asume jQueryと$は、私はそれが働いて取得する方法を発見した

Answer 1

世界的に利用可能であるが、それが最善の方法である場合、私はわかりませんよ。

// customJQPlugin.plugin.js 

module.exports = function (options) { ... } 

はその後、私のディレクティブファイルで、私は次の操作を実行できます。

$.fn.customJQPlugin = require('./customJQPlugin.plugin'); 

... 

link: function() { 
    $(elem).customJQPlugin({ 
    some: 'options' 
    }); 
} 

.... 

私はまだいくつかのエラーを持っているが、これは問題とは無関係である可能性が高い見えます。

これは最もクリーンではありませんが動作しますが、詳細がわかると更新されます。