Tailwind requires CSS rebuild after every HTML modification. (bin/dev, hotreload gems, etc., not effective)

[robertemaxwell]

Hi all,

This one has stumped both myself and (more importantly) those with far more experience and knowledge of the Rails framework and CSS engines alike. I've attached a brief 2.5 minute video below demonstrating the issue. In effect, I can change each class on an element one time, but if I try to change two or more times, I must manually rebuild the CSS.

For example, I can change a class to text-4xl from its current state of text-2xl, and it will work. But if I go to then change it to text-sm or anything other than text-2xl or text-4xl, it will effectively remove the entire class and will default to black. Same with mt classes. A perfect example is changing the default mt-28 property in application.html.erb. If I set it to, say, mt-10, that and mt-28 are the only two classes that will apply. If I tried to set any other mt level, it would fail and effectively be mt-0.

I'm currently running WSL2 Ubuntu 20.04, Rails v7.0.3, Ruby v3.1.2 -- all stable releases. I use importmaps, so no package.json to speak of. I'm now a novice+ programmer, but know my way around a troubleshoot as I was tuned-in about a decade ago. I'm open to trying any and everything in order to solve this and document the solution -- it's the first thing I've seen stump everyone in the GoRails community's CSS channel.

Thanks in advance, everyone!
RM

Link: https://streamable.com/kx0zae

[hyphenized]

Your server might be serving your manually built css instead of the rebuilt bundle created by tailwindcss cli.

Try running rake assets:clobber and see if that solves the issue.

[flavorjones]

@robertemaxwell There's a PR submitted to make the "watch" mechanism support WSL.

#168

Does that sound like it might address this issue?

[flavorjones]

See #199 for a PR which I think will resolve your issue.