[v4] Tailwind CSS v4 Beta does not work with Angular 16 after migration

[dcheglakov]

What version of Tailwind CSS are you using?
4.0.0-beta.4

What build tool (or framework if it abstracts the build tool) are you using?
Angular 16.2.16

What version of Node.js are you using?
20.14.0

What browser are you using?
Chrome, Safari, Arc

What operating system are you using?
macOS 15.1.1

Reproduction URL
https://github.com/dcheglakov/angular-tailwind

Describe your issue
I attempted to migrate from Tailwind CSS v3 to v4 following the documentation using npx @tailwindcss/upgrade@next. The process completed without errors, but the styles are no longer applied after the migration.

Initially, I suspected the issue might be related to the prefix configuration, so I created a separate branch (no-prefix) to test the migration without a prefix. Unfortunately, the result was the same.

Here are the relevant branches in the reproduction repository:

• main: Stable working version on Tailwind v3
• tailwind-4: Migrated to Tailwind v4 (non-functional)
• no-prefix: Migrated to Tailwind v4 without prefix (non-functional)

Steps to reproduce:

1. Clone the repository: https://github.com/dcheglakov/angular-tailwind.
2. Check out the tailwind-4 or no-prefix branch.
3. Build and serve the Angular app.
4. Notice that the styles are not applied.

Expected behavior:
The styles should work as they did in Tailwind CSS v3 after the migration process.

Additional Context
I followed the migration steps provided in the Tailwind CSS upgrade guide. Both the tailwind-4 and no-prefix branches demonstrate the issue. If any further information is needed, feel free to ask.

[whistleEmil]

I'll echo this also does not work on a completely new Angular 19 project; issue is the same as described, that no styles are applied.