fix(nuxt3): generate imports for components with named exports correctly (#3288)

This commit is contained in:
Daniel Roe 2022-02-17 14:23:55 +00:00 committed by GitHub
parent 65d16a58c0
commit 8adff2edf7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 2 deletions

View File

@ -37,7 +37,7 @@ function transform (content: string, components: Component[]) {
if (component) {
const identifier = map.get(component) || `__nuxt_component_${num++}`
map.set(component, identifier)
imports += genImport(component.filePath, identifier)
imports += genImport(component.filePath, [{ name: component.export, as: identifier }])
return ` ${identifier}`
}
// no matched

View File

@ -1,4 +1,5 @@
import { defineNuxtConfig } from 'nuxt3'
import { addComponent } from '@nuxt/kit'
export default defineNuxtConfig({
buildDir: process.env.NITRO_BUILD_DIR,
@ -9,5 +10,14 @@ export default defineNuxtConfig({
// @ts-ignore TODO: Fix schema types
testConfig: '123'
},
modules: ['~/modules/example']
modules: ['~/modules/example'],
hooks: {
'modules:done' () {
addComponent({
name: 'CustomComponent',
export: 'namedExport',
filePath: '~/other-components-folder/named-export'
})
}
}
})

View File

@ -0,0 +1,3 @@
export const namedExport = defineComponent({
setup: () => () => h('div', 'This is a custom component with a named export.')
})

View File

@ -5,6 +5,7 @@
</Head>
<h1>Hello Vue 3</h1>
<div>Config: {{ $config.testConfig }}</div>
<CustomComponent />
</div>
</template>