FOUC (Flash of Unstyled Content ) when using vite-ssg + tailwind

[armenr]

Describe the bug

When building my project using vite-ssg + tailwind, we consistently get FOUC on every load.

I have checked whether the same FOUC issue exists with the vanilla vitesse boilerplate, with the default code, and it does.

git clone git@github.com:antfu/vitesse.git \
  && cd vitesse \
  && pnpm i \
  && pnpm build:ssg \
  && pnpm preview

NOTE: Our base project is based on vitesse. We removed unocss and added tailwind.

Reproduction

https://github.com/antfu/vitesse

System Info

❯ npx envinfo --system --binaries --browsers
  System:
    OS: macOS 13.4.1
    CPU: (10) arm64 Apple M1 Max
    Memory: 933.11 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.16.1 - ~/.nvm/versions/node/v18.16.1/bin/node
    npm: 9.5.1 - ~/.nvm/versions/node/v18.16.1/bin/npm
  Browsers:
    Chrome: 116.0.5845.179
    Edge: 113.0.1774.57
    Firefox: 117.0
    Safari: 16.5.2

### Used Package Manager

pnpm

### Validations

- [X] Follow our [Code of Conduct](https://github.com/antfu/.github/blob/main/CODE_OF_CONDUCT.md)
- [X] Read the [Contributing Guide](https://github.com/antfu/contribute).
- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- [X] Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
- [X] The provided reproduction is a [minimal reproducible](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.