Как удалить неиспользуемый CSS из приложения React (Typescript) с помощью встроенного CSS с помощью Webpack?

Я создал виджет, используя React с Typescript. Этот виджет имеет несколько компонентов React и всего один файл Less. Сборка Webpack генерирует только один файл Javascript со всем включенным, включая CSS.

Это соответствующая часть моей конфигурации Webpack:

module: {
  rules: [
    {
      test: /\.tsx?$/,
      use: 'ts-loader',
      include: helpers.root('/src'),
    },
    {
      test: /\.css$/,
      use: [
        'style-loader',
        {
          loader: 'css-loader',
          options: {
            minimize: env === 'production',
          },
        },
      ],
      include: helpers.root('/src/assets/styles'),
    },
    {
      test: /\.less$/,
      use: [
        'style-loader',
        {
          loader: 'css-loader',
          options: {
            minimize: env === 'production',
          },
        },
        'less-loader',
      ],
      include: helpers.root('src/assets/styles'),
    },
  ],
},

Я не использую ExtractTextPlugin, поэтому вывод - это просто файл java. Я пробовал следующие плагины Webpack, но ни один из них не работает нормально, и они не удалили неиспользуемые классы из компонентов React:

  • purifycss
  • uncss
  • purgecss

Кто-нибудь знает, как решить эту проблему?

0 ответов

Другие вопросы по тегам