-
-
Notifications
You must be signed in to change notification settings - Fork 4.6k
Description
What version of Tailwind CSS are you using?
v4.1.8
What build tool (or framework if it abstracts the build tool) are you using?
├── @tailwindcss/postcss@4.1.8 ├── autoprefixer@10.4.21 ├── cross-env@5.2.1 ├── css-loader@7.1.2 ├── file-loader@6.2.0 ├── html-webpack-plugin@5.6.3 ├── lodash@4.17.21 ├── mini-css-extract-plugin@2.9.2 ├── postcss-import@16.1.0 ├── postcss-loader@8.1.1 ├── postcss@8.5.3 ├── tailwindcss@4.1.8 ├── webpack-cli@6.0.1 ├── webpack-dev-server@5.2.1 └── webpack@5.99.9
What version of Node.js are you using?
20.17.0
What browser are you using?
Chrome
What operating system are you using?
Mac OS Sonoma
Reproduction URL
Describe your issue
Updating a code set to tailwind 4 has resulted in some dev server breakage.
I'm under the impression that tailwind 4 is installed correctly:
npm run prod
produces stylesheets and code as intendednpm run dev
fires up a browser with styles included in referenced html
I'm under the impression that Webpack 5 is set up for Hot Module Reload (HMR):
- 'npm run dev' creates styles on-the-fly when introduced to index.html, using Tailwind 3.
Feature I lost with upgrade:
- 'npm run dev' to create on-the-fly tailwind styles for the browser to show when I save my work in my html file.
What's going right:
The dev server starts and stops without errors, and serves the page.
The dev server does serve a complete stylesheet when it starts.
Generally, "it works."
What's not working:
HMR (or manual) reloads appear to detect tailwindcss changes in the html, but the process of writing that style to the dev server stylesheet doesn't take place. When a tailwind class is added to the index.html, the style doesn't display. There is a void of style, instead. I am testing this with text colors on this repository. Introduced text color classes yield a dark text treatment (unstyled) and there is no style in the inspector relating to the tailwind class I just added.
I can't get a new text color to appear without shutting down and restarting my dev server, but that does work, see "what's going right".
You may find evidence in the repo of all the ways I've tried to fix this. I apologize if this amounts to errors due to me chasing my tail. I upgraded the code set manually and followed multiple sets of directions and used at least 15 keywords to search around other peoples' questions. It does look like others have reported other Hot Reload questions recently, so it seemed like it could be a bug.