What version of Tailwind CSS are you using?
4.2.4
What build tool (or framework if it abstracts the build tool) are you using?
vite v8.0.10
What version of Node.js are you using?
v25.9.0
What operating system are you using?
macOS
Reproduction URL
https://stackblitz.com/edit/vitejs-vite-xgcpdaru?file=src%2Fstyles%2Femails%2Fmain.css
Describe your issue
Importing files via @import at-rules appears to be broken. When your entry CSS is structured in nested directories with similar paths to parent folders, the imports resolve incorrectly.
@import "tailwindcss/utilities" source(none);
@import "./base/+.css";
@import "./theme/config.css";
@import "./theme/default.css";
@import "./components/+.css";
@import "./utils/+.css";
@source "../../templates/emails";
For example, ./components/+.css does not load the file from the current directory as expected, but instead resolves to a file with the same name in the parent directory.
If you run npm run build, you can see that the generated CSS output is incorrect. Downgrading to version 4.2.2 fixes the issue - the output CSS is then generated correctly with proper imports.
This regression broke our email generation pipeline after upgrading to 4.2.4. We’re also seeing related errors in our setup, which we couldn’t reproduce with a minimal Vite configuration, but they seem to stem from the incorrect import resolution.
error during build:
Build failed with 1 error:
[plugin vite:css-post]
SyntaxError: [lightningcss minify] Invalid empty selector
1 | /*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
2 | ...d]) .x-dialog-content{opacity:0;transform:translateY(-2rem)}}@keyframes marquee{to{offset-distance:100%}}@keyframe...
What version of Tailwind CSS are you using?
4.2.4
What build tool (or framework if it abstracts the build tool) are you using?
vite v8.0.10
What version of Node.js are you using?
v25.9.0
What operating system are you using?
macOS
Reproduction URL
https://stackblitz.com/edit/vitejs-vite-xgcpdaru?file=src%2Fstyles%2Femails%2Fmain.css
Describe your issue
Importing files via @import at-rules appears to be broken. When your entry CSS is structured in nested directories with similar paths to parent folders, the imports resolve incorrectly.
For example,
./components/+.cssdoes not load the file from the current directory as expected, but instead resolves to a file with the same name in the parent directory.If you run
npm run build, you can see that the generated CSS output is incorrect. Downgrading to version 4.2.2 fixes the issue - the output CSS is then generated correctly with proper imports.This regression broke our email generation pipeline after upgrading to 4.2.4. We’re also seeing related errors in our setup, which we couldn’t reproduce with a minimal Vite configuration, but they seem to stem from the incorrect import resolution.