如何在react-app-rewired中添加Webpack优化配置？

Question

我有一个项目需要与IE9兼容。

事实证明IE9对其支持的css选择器有限制，因此我缺少样式的一部分。

我正在通过create-react-app和yarn build捆绑我的项目。

当然，这总是给我一个文件。

在config-overrides.js中尝试了以下内容

const tsImportPluginFactory = require('ts-import-plugin')
const { getLoader } = require('react-app-rewired');
const rewireLess = require('react-app-rewire-less');


module.exports = function override(config, env) {

  const tsLoader = getLoader(
    config.module.rules,
    rule =>
      rule.loader &&
      typeof rule.loader === 'string' &&
      rule.loader.includes('ts-loader')
  );

  tsLoader.options = {
    getCustomTransformers: () => ({
      before: [ tsImportPluginFactory({
        libraryName: 'antd',
        libraryDirectory: 'es',
        style: true,
      }) ]
    })
  };

  config = rewireLess.withLoaderOptions({
      javascriptEnabled: true,
      optimization: {
        splitChunks: {
          chunks: 'async',
          minSize: 30000,
          maxSize: 0,
          minChunks: 3,
          maxAsyncRequests: 5,
          maxInitialRequests: 3,
          automaticNameDelimiter: '~',
          name: true,
          cacheGroups: {
            vendors: {
              test: /[\\/]node_modules[\\/]/,
              priority: -10
            },
            default: {
              minChunks: 2,
              priority: -20,
              reuseExistingChunk: true
            }
          }
        }
      }
  })(config, env);

  return config;
}

，但是没有多个CSS文件的预期结果。

我不太清楚，如何将构建分为多个块？