vite-node server HMR is broken

[pi0]

Environment

• Operating System: Linux
• Node Version: v16.15.0
• Nuxt Version: 3.0.0-rc.6-27651720.5dc864d
• Package Manager: yarn@1.22.19
• Builder: vite
• User Config: experimental
• Runtime Modules: -
• Build Modules: -

Reproduction

(on Windows, Linux, Docker (Linux) or WSL2 environment)

• Create new project with npx nuxi init (swit
• Enable vite-node with `experimental
• Run dev server with npm run dev
• Write simple app.vue such as <template><div>Hello world!</div></template>
• Open http://localhost:3000
• Edit app.vue
• Reload

Describe the bug

Client is updated with HMR and subsequent reloads but server is not. Causing hydration error.

It might be related to the issue #12822 since now client HMR on Linux works and Server not (in current nuxt, it is otherwise). But also trying CHOKIDAR_USEPOLLING=1 I still have same issues.

Additional context

No response

Logs

No response

[pi0]

I can also reproduce it on MacOS (testing on 13.1). Client HMR stops working when viteNode flag is set resulting in hydration mismatch:

[pi0]

@antfu Can you please check this? I can confirm on multiple mac versions it is also broken...

Do we have a watcher still with vite-node?

[antfu]

Yes, we have Vite's watcher to invalidate the modules. I will investigate

[antfu]

I can confirm this bug in the edge build, but not in our development playground.

[antfu]

Is it still not working on Linux/Windows?

[pi0]

@antfu Yes i could constantly reproduce on Windows (Windows 11 on PC + Parallers on M2 arm64) and Randomly on Linux (WSL). Will share a screen cast of issue. It is not directly fault of vite-node BTW but when we enable vite-node, since server watcher happens first, client watcher gets broken eventually.

[pi0]

I can no longer reproduce it on rc.8. Seems an underlying library fixed the root cause!