Webpack: избегать нескольких jquery экземпляров

Question

В настоящее время мы проводим рефакторинг нашей базы кода для использования веб-пакета, но у нас возникают проблемы с jQuery. Например, события изменений, инициированные в одном файле js, больше не прослушиваются в других файлах js.

Похоже, что jQuery создается несколько раз. Когда я смотрю $.expando в файле js, вызывающем событие изменения, оно отличается от $.expando в файле js, к которому подключен прослушиватель событий. Эти два js файла принадлежат различным точкам входа в веб-пакет, и я подозреваю, что jQuery создается отдельно для каждой точки входа.

Поэтому я предполагаю, что вопрос заключается в том, как мы можем совместно использовать один экземпляр jQuery между несколько точек входа? Я подозреваю, что использование одного экземпляра jQuery решит проблему прослушивателя событий.

Кроме того, похоже, что весь код jQuery дублируется в каждом файле js, созданном веб-пакетом. Там должно быть что-то не так с нашей настройкой веб-пакета. Кроме того, я не уверен, что у нас должно быть столько точек входа.

Вот наш конфиг веб-пакета:

const webpack = require('webpack');
const path = require('path');

const Dotenv = require('dotenv-webpack');
const ManifestPlugin = require('webpack-manifest-plugin');
const {
  CleanWebpackPlugin
} = require('clean-webpack-plugin');
const WebpackWatchedGlobEntries = require('webpack-watched-glob-entries-plugin');

const distPath = path.resolve(__dirname, 'public');
const globEntries = require('./entry-globs');

module.exports = {
  entry: WebpackWatchedGlobEntries.getEntries(
    globEntries.globs, {
      ignore: globEntries.ignore
    }
  ),
  output: {
    path: distPath,
    filename: '[name].[chunkhash:4].js'
  },
  watchOptions: {
    poll: true // to make it work with vagrant
  },
  module: {
    rules: [{
      test: require.resolve('jquery'),
      use: [{
          loader: 'expose-loader',
          options: 'jQuery'
        },
        {
          loader: 'expose-loader',
          options: '$'
        }
      ]
    }]
  },
  resolve: {
    alias: {
      surveylabJsAssets: path.resolve(__dirname, './vendor/cloud-solutions/surveylab/assets/js'),
    }
  },
  plugins: [
    new WebpackWatchedGlobEntries(),
    new Dotenv(), // used to access .env vars eg: process.env.SENTRY_API_KEY
    new webpack.ProvidePlugin({
      $: 'jquery',
      jQuery: 'jquery'
    }),
    new ManifestPlugin({
      fileName: 'manifest.js.json',
      publicPath: '/',
      basePath: '/',
    }),
    // clean the plugin just for the js dist folder since we handle the other assets with gulp
    new CleanWebpackPlugin({
      // Simulate the removal of files. default: false. Set to true to test the cleanOnceBeforeBuildPatterns
      //dry: true,
      cleanOnceBeforeBuildPatterns: ['js/*', 'manifest.js.json']
    }),
  ]
};