Запретить веб-пакет повторно использовать код между точками входа в cachedGroups

Question

Я надеюсь, что кто-то может помочь мне.

Мой проект использует реаги и веб-пакет. При рендеринге на стороне сервера (поем реагирующая для.net) я использую веб-пакет для создания моего CSS. В ssr я могу определить, какой тэг css загрузить, через разные точки входа, которые есть в моем приложении.

Идея состоит в том, что каждая точка входа будет иметь 2 файла CSS. Один для критических и один для остальных.

Работает нормально, но с одной стороны. Когда я использую один и тот же компонент более чем в одной точке входа, webpack создает для этого общие файлы CSS.

Но у меня есть чувство, что это происходит только с файлом, который идет в cacheGroups.

module.exports = {
  mode: 'production',
  entry: {
    LoaderContainer: './js/containers/loader/loaderContainer.js',
    ReviewsContainer: './js/containers/reviews/reviewsContainer.js',
    TopBarContainer: './js/containers/topBar/topBarContainer.js',
    VideoPlayer: './js/components/grid-editor/VideoPlayer.js',
    HomePageContainer: './js/containers/homePage/HomePageContainer.js',
    SearchContainer: './js/containers/search/SearchContainer.js',
    TourDetailContainer: './js/containers/tourDetail/TourDetailContainer.js',
    FAQWidgetContainer: './js/components/faq/FaqsContainer.js',
    CallUsContainer: './js/components/call-us/CallUsContainer.js',
    GetInTouchContainer: './js/components/get-in-touch/GetInTouchContainer.js',
    FAQContainer: './js/components/faq/FAQSectionContainer.js',
    LandingPageContainer: './js/containers/landingPage/LandingPageSsr.js',
    TourHeader: './js/components/tour-detail/TourHeader.js',
    PostDetailContainer: './js/containers/blog/postDetailContainer.js',
    HeaderContainer: './js/containers/header/headerContainer.js',
    FeedbackContainer: './js/containers/feedback/feedbackContainer.js',
    OurPromise: './js/components/home-page/OurPromise.js'
  },
  optimization: {
    mergeDuplicateChunks: false,
    concatenateModules: false,
    splitChunks: {
      chunks: 'initial',
      maxAsyncRequests: 1,
      maxInitialRequests: 1,
      cacheGroups: {
        critical: {
          test: /critical(.+?)\.scss$/,
          enforce: true
        }
      }
    }
  },

  cache: false,
  devtool: 'source-map',
  output: {
    path: path.resolve(__dirname, '../../dist/'),
    publicPath: '/dist/'
  },
  externals: externals,
  plugins: [
    new CleanWebpackPlugin([path.resolve(__dirname, '../../dist/')], {
      root: path.resolve(__dirname, '../../')
    }),
    new webpack.IgnorePlugin(/moment/),
  ],
  module: {
    rules: [
      {
        test: /\.(js|jsx)?$/,
        loaders: ['babel-loader'],
        include: [path.resolve(__dirname, '../js/')],
        exclude: /node_modules|bower_components/
      },
      {
        test: /\.svg$/,
        loader: 'svg-inline-loader'
      },
      {
        test: /\.scss$/,
        exclude: /\.module\.scss$/,
        sideEffects: true,
        use: [
          MiniCssExtractPlugin.loader,
          stylesLoaders.CSSLoader,

          stylesLoaders.sassLoader
        ]
      },
      {
        test: /\.module\.scss$/,
        use: [
          MiniCssExtractPlugin.loader,
          stylesLoaders.CSSModuleLoader,
          stylesLoaders.sassLoader
        ]
      }
    ]
  },
  resolve: {
    modules: ['node_modules', path.resolve('.')]
  },
  node: {
    net: 'empty',
    tls: 'empty',
    dns: 'empty'
  }
}

обычно вывод такой: критический ~HeaderContainer.min.ccs HeaderContainer.min.css

но иногда у меня есть: критический ~HomePageContainer~LandingPageContainer~OurPromise.min.css

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

Я попробовал все. Если бы кто-то мог помочь, было бы здорово