vite-plugin-tailwindcss-cleaner

Why?

Tailwind v4 as been released and the tailwind vite plugin does not (yet) eliminate dead css.

What does it do?

• Remove unused custom properties in cascade
• Remove unused keyframes
• Print basic logs

How to install?

npm i vite-plugin-tailwindcss-cleaner

How to use?

import { defineConfig } from "vite"
import tailwindcss from "@tailwindcss/vite"
import tailwindcssCleaner from "vite-plugin-tailwindcss-cleaner"

export default defineConfig({
	plugins: [
		tailwindcss(),
		tailwindcssCleaner()
	]
})

Is it worth it?

| | No plugin | With plugin |
|------------|-----------|--------| | CSS output | 17.3kb | 4.06kb |