sndyuk/mangle-css-class-webpack-plugin

how to use with nextjs & tailwind

frog1123 opened this issue · 1 comments

classnames and css doesnt change

current next.config.js

/** @type {import('next').NextConfig} */

const path = require('path');
const MangleCssClassPlugin = require('mangle-css-class-webpack-plugin');

module.exports = {
  reactStrictMode: true,
  swcMinify: true,
  sassOptions: {
    includePaths: [path.join(__dirname, 'styles')]
  },
  webpack(config, { dev }) {
    config.plugins.push(
      new MangleCssClassPlugin({
        classNameRegExp: '((hover|focus|active|disabled|visited|first|last|odd|even|group-hover|focus-within|xs|sm|md|lg|xl)[\\\\]*:)*tw-[a-zA-Z0-9_-]*([\\\\]*/[0-9]*)?',
        ignorePrefixRegExp: '((hover|focus|active|disabled|visited|first|last|odd|even|group-hover|focus-within|xs|sm|md||lg|xl)[\\\\]*:)*',
        log: true
      })
    );

    return config;
  }
};

nvm the problem was i didnt change my class names to have tw- in front