(vite) Flash of unstyled content occurring on dev environment

[aAtila]

What version of Remix are you using?

2.2.0

Are all your remix dependencies & dev-dependencies using the same version?

• Yes

Steps to Reproduce

• clone https://github.com/aAtila/remix-vite-css-flash
• npm run dev
• visit http and do a couple of hard reloads (ctrl+shift+r)

Expected Behavior

Styles should be applied seamlessly upon page load without any interim period of unstyled content.

Actual Behavior

I am experiencing a flash of unstyled content when pages are initially loaded on my development environment. This issue manifests as unstyled content displaying for a brief moment - typically a second or two - before the styles are applied.

Occurence

• dev: This behavior is consistently reproducible in the development environment only.
• build: The issue is not present when serving a build; the styles load as expected without any noticeable delay.

[rodolphoasb]

Possible duplicate of #7853 and #7870

[pcattori]

Duplicate of #7878

[quantuminformation]

Im getting a flash of styled content then unstyled for infinity