Webpack v4 с несколькими записями на одной странице, чанки дублируются без надобности

У меня есть многостраничный веб-сайт с подмножеством страниц, которое является SPA. Мы только что обновились до Webpack V4 и столкнулись с некоторыми новыми проблемами, которых раньше не видели.

Наши страницы всегда включают тег скрипта для app.build.js. Этот файл имеет глобальные инициалы и импортирует наш общедоступный путь. Он импортирует такие вещи, как Modernizr, и создает навигацию по нашему сайту.

Кроме того, для каждой страницы мы обслуживаем второй файл JS, например account.build.js. На некоторых страницах нет второго файла, если они очень простые. Однако им по-прежнему нужен app.build.js для создания навигации.

Похоже, что Webpack не знает об этой комбинации, поэтому в двух выходных файлах есть избыточные фрагменты. они оба могут включать в себя тест Modernizr и т. д., и все это добавляется к обоим файлам сборки, значительно их раздувая.

У меня вопрос: как сообщить Webpack, что app.build.js включен глобально ??? Мы делаем это с помощью SplitChunks для наших поставщиков, но он соответствует импорту, а не имени файла записи.

Теперь нам также нужно import './public-path'; в каждом файле ввода, что не идеально. Я бы предпочел сделать это один раз в app.build.js, чтобы он был признан во всем мире.

Сообщение об ошибке с Webpack зарегистрировано здесь: https://github.com/webpack/webpack/issues/8842 < / а>


webpack build javascript node-modules webpack-4
person lostPixels    schedule 20.02.2019    source источник
comment
Можете ли вы опубликовать содержимое вашего webpack.config.js?   -  person Munim Munna    schedule 27.02.2019
comment
Конечно же, вот оно: gist.github.com/lostPixels/fef3f0cc4a32096c3d5bf5b5c4e6e6e05e6e5   -  person lostPixels    schedule 27.02.2019
comment
Вы нашли ответ тогда @lostPixels?   -  person Bregt    schedule 16.11.2020

Ответы (1)


arrow_upward
0
arrow_downward

Если вы хотите переместить все дубликаты в один файл (commons.js), оставив в стороне все файлы поставщиков в vendors.js, вы можете указать несколько групп кеширования. Этот commons.js будет содержать все модули, дублированные во всех ваших точках входа.

optimization: {
  splitChunks: {
    cacheGroups: {
      vendors: {
        test: /[\\/]node_modules[\\/]/,
        name: 'vendors',
        chunks: 'all'
      },
      commons: {
        name: 'commons',
        chunks: 'all',
        minChunks: 2,
        enforce: true,
      },
    }
  }
}
person Munim Munna    schedule 27.02.2019
comment
К сожалению, мы попробовали это, и он не улавливает фрагменты, включенные в два файла ввода, которые объединены в один HTML-документ. - person lostPixels; 27.02.2019