Demo, all content is generated
Question

Tailwind classes work in dev, missing in production build

Solved · 376 views · asked by yuki_builds · edited

Some buttons lose their styling after next build. Dev is fine. The classes are there in the HTML.

What I’ve tried

Cleared .next, rebuilt from scratch, and checked the classes are spelled the same in dev and prod.

Comment

1 answer

Marked as helpful by the asker
dev_ana · edited

Tailwind only ships classes it can see in your source. Dynamic strings hide them:

// invisible to Tailwind
className={`bg-${color}-500`}
// visible
className={color === 'red' ? 'bg-red-500' : 'bg-blue-500'}

Search your code for template literals inside className. v0 loves them. In dev everything is compiled on demand, so it hides the problem until the production build.

Comment
Exactly this, bg-${variant}-600. Switched to a lookup object. yuki_builds · edited