Tailwind CSS v4 classes in new or moved files are not picked up by ng serve until another rebuild
Maintainers usually reply within 1 day
Nobody has claimed this yet.
- #34451 by @MeAkib — closed without merging
Assessment
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Newbie friendliness
- 35/100
- Issue type
- Bug
- Clarity
- Clearly specified
- Activity status
- Stale
- Tech stack
- angular, node.js, tailwindcss, typescript
- Domain
- build-system, devtools
Research direction
Start with src/tools/esbuild/stylesheets/stylesheet-plugin-factory.js, where PostCSS directory dependency messages are expanded and existing files are added to watchFiles. Trace how esbuild receives watch dependencies and how file add, unlink, or rename events are handled. Done means the reproduction generates classes for newly created or moved source files on the next rebuild; an open linked pull request indicates work is already underway.
Written by the indexing model from the issue text.
Description
Command
build
Is this a regression?
- Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was
No response
Description
In @angular/build 22.2.2 (and 22.2.3), src/tools/esbuild/stylesheets/stylesheet-plugin-factory.js handles PostCSS dir-dependency messages by expanding the glob with tinyglobby and adding the resulting files to watchFiles. Only files that exist at build time are watched. A file created later, or moved by renaming its folder, is never watched, so classes used only in it are not generated until something else triggers a stylesheet rebuild. esbuild has no directory/glob watch to fall back on, so the dir itself should probably be watched (or the glob re-expanded on add/unlink events).
Minimal Reproduction
- Angular 22 app with Tailwind v4 via @tailwindcss/postcss; run ng serve.
- Create src/app/foo/foo.ts using a class not used elsewhere, e.g. bg-[#123456]. It is generated.
- Rename the folder to src/app/bar/ and edit the file to use bg-[#654321]. The class is not generated.
- Touch src/styles.css. Now it is generated.
NG_BUILD_WATCH_ROOT=1 stops detecting changes entirely. Polling ("poll": 1000) doesn't help either.
Exception or Error
Classes in files added or moved under Tailwind's sources are generated on the next rebuild, as with modifications.
Your Environment
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI : 22.2.0
Angular : 22.2.0
Node.js : 24.15.0
Package Manager : bun 1.4.2
Operating System : linux x64
┌───────────────────────────┬───────────────────┬───────────────────┐
│ Package │ Installed Version │ Requested Version │
├───────────────────────────┼───────────────────┼───────────────────┤
│ @angular/aria │ 22.2.0 │ 22.2.0 │
│ @angular/build │ 22.2.0 │ 22.2.0 │
│ @angular/cdk │ 22.2.0 │ 22.2.0 │
│ @angular/cli │ 22.2.0 │ 22.2.0 │
│ @angular/common │ 22.2.0 │ 22.2.0 │
│ @angular/compiler │ 22.2.0 │ 22.2.0 │
│ @angular/compiler-cli │ 22.2.0 │ 22.2.0 │
│ @angular/core │ 22.2.0 │ 22.2.0 │
│ @angular/material │ 22.2.0 │ 22.2.0 │
│ @angular/platform-browser │ 22.2.0 │ 22.2.0 │
│ @angular/platform-server │ 22.2.0 │ 22.2.0 │
│ @angular/router │ 22.2.0 │ 22.2.0 │
│ @angular/ssr │ 22.2.0 │ 22.2.0 │
│ rxjs │ 7.8.2 │ ^7.8.2 │
│ typescript │ 6.0.2 │ 6.0.2 │
│ vitest │ 4.1.11 │ 4.1.11 │
Anything else relevant?
No response
- Dominant language
- TypeScript
- Stars
- 27k
- Forks
- 11.8k
- Avg merge
- 1d 3h
- Merged PRs (30d)
- 271
Getting set up
- No Dockerfile or Docker Compose file
- Has a pull request template
- Read the contributing guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from angular/angular-cli
-
Font inlining cache is not created or reusedPossibly taken @nagahara-naoki claimed this today. Openarea: @angular/build
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
angular/angular-cli#34719 ·
Maintainers usually reply within 1 day
-
area: @angular/cli
Difficulty 3/5 Half a day Newbie friendliness 42/100
angular/angular-cli#34716 ·
Maintainers usually reply within 1 day
-
Difficulty 3/5 1-2 days Newbie friendliness 72/100
angular/angular-cli#34688 ·
Maintainers usually reply within 1 day
-
`ng generate application` produces a missing stylesheet when a workspace component type is configuredPossibly taken @nagahara-naoki claimed this 2 days ago. Openarea: @schematics/angular
Difficulty 2/5 1-3 hours Newbie friendliness 25/100
angular/angular-cli#34684 ·
Maintainers usually reply within 1 day
-
area: @angular/build
Difficulty 4/5 3-5 days Newbie friendliness 55/100
angular/angular-cli#34674 · 2 comments ·
Maintainers usually reply within 1 day
All issues in angular/angular-cli
Similar issues
-
transformer-directives: `@apply` drops a utility whose CSS is a substring of an earlier one'sPossibly taken A pull request linked to this issue is open or already merged. Open
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 62/100
milind-soni/OpenMausBot#5829 ·
Maintainers usually reply within 1 day
-
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
Maintainers usually reply within 1 day
-
enhancement possible-duplicate
Difficulty 1/5 1-3 hours Newbie friendliness 78/100
AOSSIE-Org/PictoPy#1715 · 2 comments ·
Maintainers usually reply within 6 days
-
Difficulty 2/5 1-3 hours Newbie friendliness 62/100
OHDSI/Data2Evidence#3693 ·
Maintainers usually reply within 3 days