Vue2 single-file components instantiated by router lose their default names after hot reload

[haysmike]

Vue devtools version

6.4.5

Link to minimal reproduction

https://github.com/haysmike/vue-name-test

Steps to reproduce & screenshots

1. Pull down linked repo and cd into it.
2. yarn.
3. yarn serve.
4. Load the app up in Chrome, open up Vue DevTools, find HomeView.
5. Go to HomeView.vue and comment out the console.log() statement on line 18. Save the file.
6. Go back to Chrome, look at Vue DevTools.

What is expected?

It should look like this:

What is actually happening?

HomeView has become Anonymous Component:

System Info

System:
    OS: macOS 12.6.1
    CPU: (8) x64 Intel(R) Core(TM) i5-8257U CPU @ 1.40GHz
    Memory: 742.72 MB / 16.00 GB
    Shell: 5.8.1 - /usr/local/bin/zsh
  Binaries:
    Node: 16.15.0 - ~/.nodenv/versions/16.15.0/bin/node
    Yarn: 1.22.17 - /usr/local/bin/yarn
    npm: 8.5.5 - ~/.nodenv/versions/16.15.0/bin/npm
  Browsers:
    Brave Browser: 107.1.45.127
    Chrome: 107.0.5304.110
    Firefox: 100.0
    Safari: 16.1
  npmPackages:
    vue: ^2.6.14 => 2.7.14

Any additional comments?

• This only occurs with components that are instantiated by the router.
• This only occurs in Vue2, not in Vue3.
• Specifying a name in the component fixes this. My team is considering adding the vue/require-name-property ESLint rule to avoid this, but given that our main app has over 300 components (and we have several other Vue repos), it's a significant annoyance and prone to renaming mistakes.

Thanks for taking a look!