Changed be color correctly appears one page is refreshed.
Previous state before changes are sent to the client instead.
This issue does not re-produce on CodeSandbox, but I have duplicated it with the given repo on my desktop and laptop. Both running windows. Maybe the issue is somehow windows related? Downgrading Nuxt from 3.1.1 to 3.1.0 does fix the issue so not sure if the issue is something in Nuxt or the Tailwind module.
Im getting something similar where I set a flex layout, it works. I refresh, and it breaks.
Since I think it's similar to yours, I'd like to expand upon the issue I'm having. I make a change, it updates on the page. I refresh the page, that change goes away. If I make the change again, it will appear on the dev server once more. But again it disappears after a refresh. They styles don't apply if I build the project. I'm using a mac, yarn, and node 18 lts. Using Nuxt Tailwind 6.4.1, Nuxt 3.2.2.
I haven't noticed a consistent pattern, however this doesn't happen with every element.
Your issue is basically the same as mine. I've noticed all of the same behavior as you. For what its worth downgrading to Nuxt 3.1 does fix the issue completely, and you're not missing out on too much.
I haven't fully tested it, but I think the same behavior happens if you install Tailwind without using the module as well which might indicate that it's actually an issue in the main Nuxt package instead of the module.
I can reproduce the bug using vanilla tailwind as well on this branch. https://github.com/JacobLindelof/nuxt-tailwind-testing/tree/tailwind-no-module
I also noticed that when trying to debug the issue on Stackblitz whenever the page refreshes I get a Vite server hmr X files console message, but on my computer I don't get any hmr messages.
Similar issue here vitejs/vite#10270
|Issue Title||Created Date||Updated Date|