diff --git a/packages/runtime-vapor/src/component.ts b/packages/runtime-vapor/src/component.ts
index 7989b67a8..2855fa9ce 100644
--- a/packages/runtime-vapor/src/component.ts
+++ b/packages/runtime-vapor/src/component.ts
@@ -172,6 +172,13 @@ export function createComponent(
       frag.hydrate()
     }
 
+    if (__DEV__) {
+      const instance = currentInstance as VaporComponentInstance
+      ;(instance!.hmrEffects || (instance!.hmrEffects = [])).push(() =>
+        frag.remove(frag.anchor.parentNode!),
+      )
+    }
+
     return frag as any
   }
 
@@ -389,6 +396,7 @@ export class VaporComponentInstance implements GenericComponentInstance {
   devtoolsRawSetupState?: any
   hmrRerender?: () => void
   hmrReload?: (newComp: VaporComponent) => void
+  hmrEffects?: (() => void)[]
   propsOptions?: NormalizedPropsOptions
   emitsOptions?: ObjectEmitsOptions | null
   isSingleRoot?: boolean
diff --git a/packages/runtime-vapor/src/hmr.ts b/packages/runtime-vapor/src/hmr.ts
index 741f38586..c960a2610 100644
--- a/packages/runtime-vapor/src/hmr.ts
+++ b/packages/runtime-vapor/src/hmr.ts
@@ -19,6 +19,10 @@ export function hmrRerender(instance: VaporComponentInstance): void {
   const parent = normalized[0].parentNode!
   const anchor = normalized[normalized.length - 1].nextSibling
   remove(instance.block, parent)
+  if (instance.hmrEffects) {
+    instance.hmrEffects.forEach(e => e())
+    instance.hmrEffects.length = 0
+  }
   const prev = currentInstance
   simpleSetCurrentInstance(instance)
   pushWarningContext(instance)
@@ -36,6 +40,10 @@ export function hmrReload(
   const parent = normalized[0].parentNode!
   const anchor = normalized[normalized.length - 1].nextSibling
   unmountComponent(instance, parent)
+  if (instance.hmrEffects) {
+    instance.hmrEffects.forEach(e => e())
+    instance.hmrEffects.length = 0
+  }
   const prev = currentInstance
   simpleSetCurrentInstance(instance.parent)
   const newInstance = createComponent(