From db27049caaae08978995f25b61f8336f543a4640 Mon Sep 17 00:00:00 2001 From: "Tommy D. Rossi" Date: Fri, 24 Apr 2026 16:11:48 +0200 Subject: [PATCH] fix(@tailwindcss/vite): include @variant in feature detection (#19966) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Fixes #19964 CSS files imported via JS that only use `@variant` (no `@apply`, `theme()`, or utility classes) are silently skipped by the Vite plugin. The `@variant` directive gets passed through raw to the browser, which drops it as an unknown at-rule. **Root cause** — `Features.Variants` is missing from the [feature detection bitmask](https://github.com/tailwindlabs/tailwindcss/blob/v4.2.4/packages/%40tailwindcss-vite/src/index.ts#L526): ```ts // before Features.AtApply | Features.JsPluginCompat | Features.ThemeFunction | Features.Utilities // after Features.AtApply | Features.JsPluginCompat | Features.ThemeFunction | Features.Utilities | Features.Variants ``` **Reproduction** — https://github.com/remorses/tailwind-variant-bug --------- Co-authored-by: Robin Malfait --- CHANGELOG.md | 1 + packages/@tailwindcss-vite/src/index.ts | 6 +++++- 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 29bb63b49..47b21eed2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Ensure `@plugin` resolves package JavaScript entries instead of browser CSS entries when using `@tailwindcss/vite` ([#19949](https://github.com/tailwindlabs/tailwindcss/pull/19949)) - Fix relative `@import` and `@plugin` paths resolving from the wrong directory when using `@tailwindcss/vite` ([#19965](https://github.com/tailwindlabs/tailwindcss/pull/19965)) +- Ensure CSS files containing `@variant` are processed by `@tailwindcss/vite` ([#19966](https://github.com/tailwindlabs/tailwindcss/pull/19966)) ## [4.2.4] - 2026-04-21 diff --git a/packages/@tailwindcss-vite/src/index.ts b/packages/@tailwindcss-vite/src/index.ts index c6b2786f7..bf14817f7 100644 --- a/packages/@tailwindcss-vite/src/index.ts +++ b/packages/@tailwindcss-vite/src/index.ts @@ -537,7 +537,11 @@ class Root { if ( !( this.compiler.features & - (Features.AtApply | Features.JsPluginCompat | Features.ThemeFunction | Features.Utilities) + (Features.AtApply | + Features.JsPluginCompat | + Features.ThemeFunction | + Features.Utilities | + Features.Variants) ) ) { return false