Description
Tailwind CSS v4.1.5 Monorepo Issue: Missing Utility Classes in Production Build
Environment Details
What version of Tailwind CSS are you using?
v4.1.5
What build tool (or framework if it abstracts the build tool) are you using?
Next.js 15 with Turbopack
What version of Node.js are you using?
v23
What browser are you using?
Chrome latest
What operating system are you using?
macOS
Monorepo Structure
assetos/
├── apps/
│ └── dashboard/
│ ├── src/
│ │ └── app/
│ │ ├── layout.tsx
│ │ └── globals.css
│ ├── .next/
│ ├── package.json
│ ├── next.config.ts
│ └── Dockerfile.optimized
├── packages/
│ └── ui/
│ ├── src/
│ │ └── theme.css
│ ├── tailwind.config.js
│ ├── postcss.config.mjs
│ └── package.json
├── node_modules/
├── package.json
├── pnpm-workspace.yaml
└── ...
Describe your issue
After upgrading to Tailwind CSS v4.1.5, utility classes are not being generated in the production build, despite following all recommended configurations and best practices. The issue appears to be related to how Tailwind processes files in a monorepo structure.
Current Setup
-
UI Package (
packages/ui
):- Contains shared UI components and theme
- Has its own
tailwind.config.js
(tried as a workaround / fallback - also didn't fix the issue) andpostcss.config.mjs
- Uses
@source
directives intheme.css
to scan both app and UI components
-
Dashboard App (
apps/dashboard
):- Next.js 15 application
- Imports UI package and theme
- Uses Turbopack for development and production builds
Attempted Solutions
-
Configuration Updates:
- Updated to latest Tailwind v4.1.5
- Implemented recommended
@source
directives - Configured proper content paths in
tailwind.config.js
- Added
@config
directive in theme CSS
-
Build Process:
- Verified proper CSS imports in app's
globals.css
- Confirmed correct PostCSS configuration
- Checked for proper file scanning in development
- Verified proper CSS imports in app's
-
Monorepo Structure:
- Ensured proper workspace configuration
- Verified package dependencies
- Confirmed correct file paths in configurations
Expected Behavior
Utility classes should be generated and included in the production build, as they are in development.
Actual Behavior
Production build CSS only contains theme variables and base styles, but no utility classes (like .bg-red-500
, .text-white
, etc.).
Additional Context
This issue appears to be related to how Tailwind v4.1.5 processes files in a monorepo structure, particularly with the @source
directive and file path resolution. The problem persists despite following all official documentation and best practices for Tailwind v4 monorepo setups.
Reproduction Steps
tbd
Related Issues
- Similar issues reported in Tailwind CSS GitHub issues for monorepo setups
- Potential connection to file path resolution in monorepo structures