fix(hydration): handle correctly vue compiler defineComponent import

src/plugins/hydration.ts

@@ -26,34 +26,38 @@ export const InjectHydrationPlugin = createUnplugin(() => {
           const imports = program.body.filter(node => node.type === 'ImportDeclaration')
           const hasDefineComponent = DEFINE_COMPONENT_RE.test(code)
           const hasDefineNuxtComponent = DEFINE_NUXT_COMPONENT_RE.test(code)
-          const importsToAdd = new Set([
-            hasDefineComponent
-            && genImport(
-              '@nuxt/hints/runtime/hydration/component',
-              ['defineComponent'],
-            ),
-            hasDefineNuxtComponent
-            && genImport(
-              '@nuxt/hints/runtime/hydration/component',
-              ['defineNuxtComponent'],
-            ),
-          ].filter(Boolean))
 
           const defineComponentImport = findImportSpecifier(imports as ImportDeclaration[], 'defineComponent', ['vue', '#imports'])
+          const defineComponentAlias = defineComponentImport?.local.name || 'defineComponent'
           if (defineComponentImport) {
             m.remove(
               defineComponentImport.start,
               defineComponentImport.end,
             )
           }
+
           const defineNuxtComponentImport = findImportSpecifier(imports as ImportDeclaration[], 'defineNuxtComponent', ['#app/composables/component', '#imports', '#app', 'nuxt/app'])
+          const defineNuxtComponentAlias = defineNuxtComponentImport?.local.name || 'defineNuxtComponent'
           if (defineNuxtComponentImport) {
             m.remove(
               defineNuxtComponentImport.start,
               defineNuxtComponentImport.end,
             )
           }
 
+          const importsToAdd = new Set([
+            hasDefineComponent
+            && genImport(
+              '@nuxt/hints/runtime/hydration/component',
+              [defineComponentAlias === 'defineComponent' ? 'defineComponent' : { name: 'defineComponent', as: defineComponentAlias }],
+            ),
+            hasDefineNuxtComponent
+            && genImport(
+              '@nuxt/hints/runtime/hydration/component',
+              [defineNuxtComponentAlias === 'defineNuxtComponent' ? 'defineNuxtComponent' : { name: 'defineNuxtComponent', as: defineNuxtComponentAlias }],
+            ),
+          ].filter(Boolean))
+
           m.prepend([...importsToAdd].join('\n') + '\n')
 
           if (m.hasChanged()) {

test/unit/hydration/vite-plugin.test.ts

@@ -103,6 +103,26 @@ describe('InjectHydrationPlugin', () => {
       const result = await modifyImportPluginTransform(code, 'test.ts')
       expect(result).toBe(undefined)
     })
+
+    it('should handle aliased defineComponent import', async () => {
+      const code = `import { defineComponent as _defineComponent } from 'vue'\nexport default _defineComponent({})`
+      const result = await modifyImportPluginTransform(code, 'test.ts')
+      expect(result.code).toContain(genImport(
+        '@nuxt/hints/runtime/hydration/component',
+        [{ name: 'defineComponent', as: '_defineComponent' }],
+      ))
+      expect(result.code).not.toContain(`import { defineComponent as _defineComponent } from 'vue'`)
+    })
+
+    it('should handle aliased defineNuxtComponent import', async () => {
+      const code = `import { defineNuxtComponent as _defineNuxtComponent } from '#app'\nexport default _defineNuxtComponent({})`
+      const result = await modifyImportPluginTransform(code, 'test.ts')
+      expect(result.code).toContain(genImport(
+        '@nuxt/hints/runtime/hydration/component',
+        [{ name: 'defineNuxtComponent', as: '_defineNuxtComponent' }],
+      ))
+      expect(result.code).not.toContain(`import { defineNuxtComponent as _defineNuxtComponent } from '#app'`)
+    })
   })
 
   describe('inject-hydration-composable', () => {