SSR doesnt render css correctly causing flashing in the vite ssr vue3 starter

[SebbeJohansson]

Describe the bug

I am not sure this is how Vite is supposed to work, because I mainly work with nuxt.
While investigating a scss issue in nuxt, I noticed this issue in vite.

When loading the vite ssr vue3 starter, the CSS flashes. Notice that the text is first in the top left corner, and then moves to the middle.

chrome_dYnWsMdBTM.mp4

Reproduction

https://stackblitz.com/edit/github-ivbl8cvj?file=README.md

Steps to reproduce

1. Run npm install & npm run dev
2. Load the page.
3. Notice that the text is first in the top left corner, and then moves to the middle.

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 20.19.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.8.2 - /usr/local/bin/npm
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  npmPackages:
    @vitejs/plugin-vue: ^5.2.3 => 5.2.3 
    @vitejs/plugin-vue-jsx: ^4.1.2 => 4.1.2 
    vite: ^6.3.2 => 6.3.3

Used Package Manager

npm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[hi-ogawa]

Closing as a duplicate of #16515