1. ホーム
  2. javascript

[解決済み] WebpackでjQueryを本物のWindowオブジェクトに公開する

2022-05-13 22:59:50

質問

ブラウザの開発者コンソールからアクセスできるグローバルウィンドウオブジェクトに、jQueryオブジェクトを公開したいのです。現在、私のwebpackの設定には、次の行があります。

plugins: [
                new webpack.ProvidePlugin({
                    $: 'jquery',
                    jQuery: 'jquery'
                })
            ]

これらの行は、私の webpack モジュールの各ファイルに jQuery 定義を追加します。 しかし、プロジェクトをビルドして、このように開発者コンソールでjQueryにアクセスしようとすると、このようになります。

window.$;
window.jQuery;

これらのプロパティは未定義であると表示されます...

これを修正する方法はあるのでしょうか?

どのように解決するのですか?

この問題を解決するには 公開ローダー .

npm install expose-loader --save-dev

必要な時にどちらか一方を行う。

require("expose?$!jquery");

とするか、あるいは設定でこうすることができます。

loaders: [
    { test: require.resolve('jquery'), loader: 'expose?jQuery!expose?$' }
]

アップデイト : webpack 2の時点で、以下のように ローダー の代わりに 公開 :

module: {
    rules: [{
        test: require.resolve('jquery'),
        use: [{
            loader: 'expose-loader',
            options: '$'
        }]
    }]
}