fix(nuxt): island components with number prefix (#24469)

packages/nuxt/src/app/components/island-renderer.ts

@@ -4,7 +4,7 @@ import { createVNode, defineComponent, onErrorCaptured } from 'vue'
 import { createError } from '../composables/error'
 
 // @ts-expect-error virtual file
-import * as islandComponents from '#build/components.islands.mjs'
+import { islandComponents } from '#build/components.islands.mjs'
 
 export default defineComponent({
   props: {

packages/nuxt/src/components/module.ts

@@ -124,7 +124,7 @@ export default defineNuxtModule<ComponentsOptions>({
     if (nuxt.options.experimental.componentIslands) {
       addTemplate({ ...componentsIslandsTemplate, filename: 'components.islands.mjs' })
     } else {
-      addTemplate({ filename: 'components.islands.mjs', getContents: () => 'export default {}' })
+      addTemplate({ filename: 'components.islands.mjs', getContents: () => 'export const islandComponents = {}' })
     }
 
     const unpluginServer = createTransformPlugin(nuxt, getComponents, 'server')

packages/nuxt/src/components/templates.ts

@@ -86,13 +86,19 @@ export const componentsIslandsTemplate: NuxtTemplate<ComponentsTemplateContext>
       // .server components without a corresponding .client component will need to be rendered as an island
       (component.mode === 'server' && !components.some(c => c.pascalName === component.pascalName && c.mode === 'client'))
     )
-    return ['import { defineAsyncComponent } from \'vue\'', ...islands.map(
+
+    return [
+      'import { defineAsyncComponent } from \'vue\'',
+      'export const islandComponents = {',
+      islands.map(
         (c) => {
           const exp = c.export === 'default' ? 'c.default || c' : `c['${c.export}']`
           const comment = createImportMagicComments(c)
-        return `export const ${c.pascalName} = defineAsyncComponent(${genDynamicImport(c.filePath, { comment })}.then(c => ${exp}))`
+          return `  "${c.pascalName}": defineAsyncComponent(${genDynamicImport(c.filePath, { comment })}.then(c => ${exp}))`
         }
-    )].join('\n')
+      ).join(',\n'),
+      '}'
+    ].join('\n')
   }
 }
 

test/fixtures/basic/components/1thing.island.vue

@@ -0,0 +1,7 @@
+<!-- eslint-disable vue/multi-word-component-names -->
+
+<template>
+  <div>
+    Meant to detect syntax error when `components.islands.mjs` is created
+  </div>
+</template>