[Bug]: Some Tailwind CSS classes not mangled

[lazuee]

version

5.0.2

Link to minimal reproduction

https://github.com/lazuee/react-router-hono-template

Steps to reproduce

cd website && pnpm build && pnpm start

What is expected?

TailwindCSS classes should be mangled, but some classes like flex, grid, hidden, leading, group, border and ease-in-out are not being mangled.

What is actually happening?

System Info

System:
    OS: Linux 6.1 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
    CPU: (16) x64 AMD EPYC 7B13
    Memory: 52.47 GB / 62.79 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 20.17.0 - ~/.nvm/versions/node/v20.17.0/bin/node
    Yarn: 1.22.22 - ~/.nvm/versions/node/v20.17.0/bin/yarn
    npm: 10.8.2 - ~/.nvm/versions/node/v20.17.0/bin/npm
    pnpm: 9.9.0 - ~/.nvm/versions/node/v20.17.0/bin/pnpm
  npmPackages:
    @hono/node-server: ^1.13.5 => 1.13.5 
    @hono/vite-dev-server: ^0.16.0 => 0.16.0 
    @react-router/dev: 7.0.0-pre.5 => 7.0.0-pre.5 
    @react-router/node: 7.0.0-pre.5 => 7.0.0-pre.5 
    @types/node: ^22.9.0 => 22.9.0 
    @types/react: ^18.3.12 => 18.3.12 
    @types/react-dom: ^18.3.1 => 18.3.1 
    @types/source-map-support: ^0.5.10 => 0.5.10 
    autoprefixer: ^10.4.20 => 10.4.20 
    clsx: ^2.1.1 => 2.1.1 
    cross-env: ^7.0.3 => 7.0.3 
    dotenv: 16.4.5 => 16.4.5 
    dotenv-expand: 11.0.6 => 11.0.6 
    esbuild: ^0.24.0 => 0.24.0 
    hono: ^4.6.9 => 4.6.9 
    is-ip: ^5.0.1 => 5.0.1 
    isbot: ^5.1.17 => 5.1.17 
    postcss: ^8.4.47 => 8.4.47 
    postcss-load-config: ^6.0.1 => 6.0.1 
    pretty-cache-header: 1.0.0 => 1.0.0 
    react: 19.0.0-rc-5c56b873-20241107 => 19.0.0-rc-5c56b873-20241107 
    react-dom: 19.0.0-rc-5c56b873-20241107 => 19.0.0-rc-5c56b873-20241107 
    react-router: 7.0.0-pre.5 => 7.0.0-pre.5 
    sass-embedded: ^1.80.6 => 1.80.6 
    source-map-support: ^0.5.21 => 0.5.21 
    tailwind-merge: ^2.5.4 => 2.5.4 
    tailwindcss: ^3.4.14 => 3.4.14 
    tailwindcss-patch: ^5.0.2 => 5.0.2 
    tsx: ^4.19.2 => 4.19.2 
    typescript: ^5.6.3 => 5.6.3 
    unplugin-tailwindcss-mangle: ^4.0.2 => 4.0.2 
    usehooks-ts: ^3.1.0 => 3.1.0 
    vite: ^5.4.10 => 5.4.10 
    vite-tsconfig-paths: ^5.1.1 => 5.1.1

Any additional comments?

No response

[sonofmagic]

Here’s the situation: during the design phase, since unplugin-tailwindcss-mangle automatically converts all string literals in JavaScript, we excluded classes without a hyphen (like flex, hidden, etc.) to avoid unintended conversions.

Code Link

Additionally, ease-in-out is retained as a keyword because it conflicts with properties in the document’s animate function.

Code Link
Issue21

I hope this helps, and please feel free to share any suggestions or questions.

[lazuee]

Thanks for the explanation!