Doesn't properly work with Semantic-UI Less

[IvanDimitrov2002]

So I've tested the plugin and it seems to work. The problem I face tho is that Purge cleans more than it needs to. When visiting different pages some styles are gone. For example the input fields are very ugly :D and some images are gone. My next.config.js:

const withCSS = require('@zeit/next-css')
const withLess = require('@zeit/next-less')
const withPurgeCss = require('next-purgecss')
const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");

module.exports = withCSS(withLess(withPurgeCss({
  distDir: "../../dist/client",
  webpack(config, options) {
    if(process.env.NODE_ENV === 'production'){
      config.plugins = config.plugins || []
      config.plugins.push(new OptimizeCSSAssetsPlugin({
        cssProcessorPluginOptions: {
          preset: ['default', { discardComments: { removeAll: true } }],
        }
      }))
    }
    config.module.rules.push({
      test: /\.(png|svg|jpg|gif|eot|otf|ttf|woff|woff2)$/,
      use: {
        loader: 'url-loader',
        options: {
          publicPath: '/_next/static/',
          outputPath: 'static/',
          name: '[name].[ext]',
        },
      }
    })
    return config
  }
})))

My project structure is:

components/
pages/
semantic-ui/

In Semantic-UI are located .less files that compile when nextjs dev server is on or when you run next build

Thanks in advance

[ArnaudHambenne]

Experiencing similar behaviour with antd

[ShayMalchi]

Similar issue with Semantic UI. This is my next.config.js:

const withSass = require('@zeit/next-sass');
const withCSS = require('@zeit/next-css');
const withPurgeCss = require('next-purgecss');

module.exports = withCSS(
  withSass(
    withPurgeCss({
      target: 'serverless',
      webpack(config) {
        config.module.rules.push({
          test: /\.(png|svg|eot|otf|ttf|woff|woff2)$/,
          use: {
            loader: 'url-loader'
          }
        });
        return config;
      }
    })
  )
);