Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-25 15:15:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Harlan Wilton 2023-11-29 09:06:32 +11:00 committed by GitHub
parent 4b3892117f
commit 0f705f3d4a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 22 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/nuxt/src/app/components/island-renderer.ts
View File

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

2
packages/nuxt/src/components/module.ts
View File

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

20
packages/nuxt/src/components/templates.ts
View File

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

7
test/fixtures/basic/components/1thing.island.vue vendored Normal file
View File

@ -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>