Tailwind 4 and Nextjs without PostCSS

[elliason]

Is there a way to run Tailwind 4 without PostCSS, just using the Lightning CSS and the new engine as it seems to work in the Vite based setup?
I was waiting for Tailwind 4 to be able to do just that, but it seems that for nextjs the processing still goes through PostCSS, what are the reasons for this?

Thank you.

[adamwathan]

To avoid using PostCSS with Next.js currently we'd need to write a webpack plugin to take control of how CSS is loaded, which is basically the equivalent of what we're doing in Vite. Something we're interested in exploring for sure but after prototyping pieces of it it's a bit tricky in Next.js because of server components and how Next.js generates multiple bundles.

It's not possible as far as I can tell for Tailwind CSS to be a Lightning CSS plugin I'm afraid, just not the right hooks we need. We run Lightning as a separate optimization step, and even then only in production builds. In development, Tailwind doesn't use Lightning at all.

[elliason]

Ok, thank you. Love to see that happen in the future !

[markau]

Just a comment and maybe it's my own weird workflow but I often change classes in devtools to tweak a layout, and with all the classes purged with PostCSS this is difficult if not impossible. Like just now I had gap-3 wanted to see what it would be like with gap-4 .. i have to either make the code change or add to the allow list. both are slower.