fix(nuxt): de-default layout/component imports (#7389)

This commit is contained in:
Daniel Roe 2022-09-10 10:41:32 +01:00 committed by GitHub
parent b68bfb0a24
commit e60d03b940
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 6 additions and 6 deletions

View File

@ -37,10 +37,10 @@ const description = error.message || error.toString()
const stack = process.dev && !is404 ? error.description || `<pre>${stacktrace}</pre>` : undefined const stack = process.dev && !is404 ? error.description || `<pre>${stacktrace}</pre>` : undefined
// TODO: Investigate side-effect issue with imports // TODO: Investigate side-effect issue with imports
const _Error404 = defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-404.vue')) const _Error404 = defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-404.vue').then(r => r.default || r))
const _Error = process.dev const _Error = process.dev
? defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-dev.vue')) ? defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-dev.vue').then(r => r.default || r))
: defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-500.vue')) : defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-500.vue').then(r => r.default || r))
const ErrorTemplate = is404 ? _Error404 : _Error const ErrorTemplate = is404 ? _Error404 : _Error
</script> </script>

View File

@ -9,7 +9,7 @@
import { defineAsyncComponent, onErrorCaptured, provide } from 'vue' import { defineAsyncComponent, onErrorCaptured, provide } from 'vue'
import { callWithNuxt, isNuxtError, showError, useError, useRoute, useNuxtApp } from '#app' import { callWithNuxt, isNuxtError, showError, useError, useRoute, useNuxtApp } from '#app'
const ErrorComponent = defineAsyncComponent(() => import('#build/error-component.mjs')) const ErrorComponent = defineAsyncComponent(() => import('#build/error-component.mjs').then(r => r.default || r))
const nuxtApp = useNuxtApp() const nuxtApp = useNuxtApp()
const onResolve = () => nuxtApp.callHook('app:suspense:resolve') const onResolve = () => nuxtApp.callHook('app:suspense:resolve')

View File

@ -74,7 +74,7 @@ export const loaderPlugin = createUnplugin((options: LoaderOptions) => {
if (lazy) { if (lazy) {
imports.add(genImport('vue', [{ name: 'defineAsyncComponent', as: '__defineAsyncComponent' }])) imports.add(genImport('vue', [{ name: 'defineAsyncComponent', as: '__defineAsyncComponent' }]))
identifier += '_lazy' identifier += '_lazy'
imports.add(`const ${identifier} = /*#__PURE__*/ __defineAsyncComponent(${genDynamicImport(component.filePath)})`) imports.add(`const ${identifier} = /*#__PURE__*/ __defineAsyncComponent(${genDynamicImport(component.filePath, { interopDefault: true })})`)
} else { } else {
imports.add(genImport(component.filePath, [{ name: component.export, as: identifier }])) imports.add(genImport(component.filePath, [{ name: component.export, as: identifier }]))
} }

View File

@ -154,7 +154,7 @@ export const layoutTemplate: NuxtTemplate<TemplateContext> = {
filename: 'layouts.mjs', filename: 'layouts.mjs',
getContents ({ app }) { getContents ({ app }) {
const layoutsObject = genObjectFromRawEntries(Object.values(app.layouts).map(({ name, file }) => { const layoutsObject = genObjectFromRawEntries(Object.values(app.layouts).map(({ name, file }) => {
return [name, `defineAsyncComponent(${genDynamicImport(file)})`] return [name, `defineAsyncComponent(${genDynamicImport(file, { interopDefault: true })})`]
})) }))
return [ return [
'import { defineAsyncComponent } from \'vue\'', 'import { defineAsyncComponent } from \'vue\'',