Hot reload doesn't drop the old component if it's wrapped in <keep-alive>

(not sure if I’ve chosen the appropriate bug tracker for this)

Steps to reproduce:

1. Create an empty Vue project with the webpack template.
2. Open App.vue and wrap the <hello> component in a <keep-alive>.
3. Run the dev server.
4. Modify the script section of Hello component (modifying the template doesn’t trigger the issue).
5. See Components tab in vue-devtools.

Expected behavior: the wrapped component is replaced with the new version. Observed behavior: the old version is kept alive, and each change results in an additional inactive component.

[Drumstix42]

It’s a shame this issue still exists. I’ve just run into the bug as well. Do we know if this will be fixed/addressed in Vue 3?

[dwatts3624]

I posted this in #1332 but wanted to share here.

I ended up rolling the comments from @nailfar & @ericwu-wish into a plugin: https://www.npmjs.com/package/vue-keep-alive-dev

As mentioned on the other thread, I’m still wondering if it might be easier just to always append the value of componentOptions.Ctor.cid to the cache key. This is a lot of extra code for what is ultimately a small modification to a single line which doesn’t have any negative affect in production.