Vite HMR for route components does not work unless component has an active instance

[ElMassimo]

Version

4.0.11

Reproduction link

github.com

Steps to reproduce

Reproduction steps in https://github.com/ElMassimo/vite-vue-router-hmr-repro

What is expected?

HMR should work for any route component.

What is actually happening?

HMR only works if the component is the current page (because it has an active instance).

---

When the modified page component:

• is the current route, it has an active instance, so HMR works.
• is not the current route, it has no active instances, so HMR does nothing.

As a result, when modifying a component that is not the current route, the HMR update is sent as usual, but it doesn't update the module.

Then, when the route for the modified component is visited, the original module is used, which doesn't include the changes since it was never updated by HMR.

This is technically not a bug in vue-router, as there are other ways for the same bug to occur, but since it's a heavily used library and the bug can be easily experienced, it might be worth exploring.

[ElMassimo]

Closing in favor of vuejs/core#4757, as it's likely a regression, and it's definitely not specific to Vue Router.