Flash of unstyled content when hosted
Whenever I host a TanStack Start app in a VPS using a dockerfile, and I visit a page I always get a flash where no single style is applied, then a split second later, the styling gets applied. This doesn't happen when I host on Vercel.
On Vercel, the only styling that doesn't get applied as soon as the page loads is the font. I get this issue on both the vinxi and devinxi (alpha) versions. Please, how do I fix this?
10 Replies
foreign-sapphire•3mo ago
you dont have errors? how you are importing css and using vite?
rising-crimsonOP•3mo ago
I'm importing the CSS in the __root.tsx file. Here's the repository: https://github.com/gozmanthefirst/tanstarter.
foreign-sapphire•3mo ago
seems ok at first look, do you have any hydration warnings while testing?
optimistic-gold•3mo ago
I thin you need to set also the souce when importing tailwind
or you will have hydration error
optimistic-gold•3mo ago
GitHub
[Start] CSS files in node-server build don't work with Tailwind 4.0...
Which project does this relate to? Start Describe the bug When using TailwindCSS v4.0 beta, the node-server build has problems with stylesheets. Here's a repro repo: https://github.com/glecetre...
rising-crimsonOP•3mo ago
Yes, I get a hydration error.
foreign-sapphire•3mo ago
try supress it to see if the error goes out, might be the case
rising-crimsonOP•3mo ago
I'll try this.
Will suppressing it eliminate the flash of unstyled content?
foreign-sapphire•3mo ago
Im not sure why, probably a react internal thing, just add the
suppressHydrationWarning to the html tag and let me knowrising-crimsonOP•3mo ago
This worked. Thank you!