mirror of
https://github.com/nuxt/nuxt.git
synced 2025-01-19 01:45:53 +00:00
fix(nuxt): lazy load and tree-shake error templates (#5930)
Co-authored-by: Pooya Parsa <pooya@pi0.io> Co-authored-by: Kevin Marrec <kevin@marrec.io>
This commit is contained in:
parent
a54925f880
commit
dce07e5831
@ -3,9 +3,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import Error404 from '@nuxt/ui-templates/templates/error-404.vue'
|
||||
import Error500 from '@nuxt/ui-templates/templates/error-500.vue'
|
||||
import ErrorDev from '@nuxt/ui-templates/templates/error-dev.vue'
|
||||
import { defineAsyncComponent } from 'vue'
|
||||
|
||||
const props = defineProps({
|
||||
error: Object
|
||||
@ -25,8 +23,8 @@ const stacktrace = (error.stack || '')
|
||||
return {
|
||||
text,
|
||||
internal: (line.includes('node_modules') && !line.includes('.cache')) ||
|
||||
line.includes('internal') ||
|
||||
line.includes('new Promise')
|
||||
line.includes('internal') ||
|
||||
line.includes('new Promise')
|
||||
}
|
||||
}).map(i => `<span class="stack${i.internal ? ' internal' : ''}">${i.text}</span>`).join('\n')
|
||||
|
||||
@ -38,5 +36,11 @@ const statusMessage = error.statusMessage ?? (is404 ? 'Page Not Found' : 'Intern
|
||||
const description = error.message || error.toString()
|
||||
const stack = process.dev && !is404 ? error.description || `<pre>${stacktrace}</pre>` : undefined
|
||||
|
||||
const ErrorTemplate = is404 ? Error404 : process.dev ? ErrorDev : Error500
|
||||
// TODO: Investigate side-effect issue with imports
|
||||
const _Error404 = defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-404.vue'))
|
||||
const _Error = process.dev
|
||||
? defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-dev.vue'))
|
||||
: defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-500.vue'))
|
||||
|
||||
const ErrorTemplate = is404 ? _Error404 : _Error
|
||||
</script>
|
||||
|
@ -6,10 +6,10 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onErrorCaptured } from 'vue'
|
||||
import { defineAsyncComponent, onErrorCaptured } from 'vue'
|
||||
import { callWithNuxt, throwError, useError, useNuxtApp } from '#app'
|
||||
// @ts-ignore
|
||||
import ErrorComponent from '#build/error-component.mjs'
|
||||
|
||||
const ErrorComponent = defineAsyncComponent(() => import('#build/error-component.mjs'))
|
||||
|
||||
const nuxtApp = useNuxtApp()
|
||||
const onResolve = () => nuxtApp.callHook('app:suspense:resolve')
|
||||
|
Loading…
Reference in New Issue
Block a user