fix(stage-ui): full load on HMR dispose to avoid corrupted models

Author: sumimakito

packages/stage-ui/src/components/scenes/live2d/Canvas.vue

@@ -91,6 +91,11 @@ defineExpose({
   captureFrame,
   canvasElement,
 })
+
+import.meta.hot?.dispose(() => {
+  console.warn('[Dev] Reload on HMR dispose is active for this component. Performing a full reload.')
+  window.location.reload()
+})
 </script>
 
 <template>

packages/stage-ui/src/components/scenes/live2d/Model.vue

@@ -402,14 +402,6 @@ onMounted(async () => {
   updateDropShadowFilter()
 })
 
-function componentCleanUp() {
-  cancelAnimationFrame(dropShadowAnimationId.value)
-  model.value && pixiApp.value?.stage.removeChild(model.value)
-}
-onUnmounted(() => {
-  componentCleanUp()
-})
-
 function listMotionGroups() {
   return availableMotions.value
 }
@@ -419,12 +411,10 @@ defineExpose({
   listMotionGroups,
 })
 
-if (import.meta.hot) {
-  // Ensure cleanup on HMR
-  import.meta.hot.dispose(() => {
-    componentCleanUp()
-  })
-}
+import.meta.hot?.dispose(() => {
+  console.warn('[Dev] Reload on HMR dispose is active for this component. Performing a full reload.')
+  window.location.reload()
+})
 </script>
 
 <template>