feat(nuxt): add formal error page
This commit is contained in:
parent
c9be671507
commit
6dfabd87d0
43
components/errorBound.vue
Normal file
43
components/errorBound.vue
Normal file
@ -0,0 +1,43 @@
|
||||
<script lang="ts" setup>
|
||||
const p = defineProps<{ error: any }>();
|
||||
const unError = {
|
||||
...p.error,
|
||||
stack: undefined,
|
||||
};
|
||||
|
||||
const copied = `
|
||||
\`${JSON.stringify(unError, null, "\t")}\`
|
||||
|
||||
---
|
||||
|
||||
Stack trace:
|
||||
|
||||
\`\`\`
|
||||
${p.error.stack}
|
||||
\`\`\`
|
||||
`;
|
||||
</script>
|
||||
<template>
|
||||
<a-typography-title> We ran into an issue.... :( <br /> </a-typography-title>
|
||||
<a-typography-paragraph
|
||||
style="font-size: 125%"
|
||||
:copyable="{
|
||||
text: copied,
|
||||
tooltip: true,
|
||||
onCopy: () => {
|
||||
setTimeout(() => {
|
||||
clearError({ redirect: '/' });
|
||||
navigateTo('/');
|
||||
}, 30000);
|
||||
},
|
||||
}"
|
||||
>
|
||||
<a-typography-text code>
|
||||
{{ JSON.stringify(unError, null, "\t") }}
|
||||
</a-typography-text>
|
||||
<a-typography-title :level="4"> Stack trace: </a-typography-title>
|
||||
<a-typography-text>
|
||||
<a-typography-text v-html="error.stack"> </a-typography-text>
|
||||
</a-typography-text>
|
||||
</a-typography-paragraph>
|
||||
</template>
|
10
error.vue
Normal file
10
error.vue
Normal file
@ -0,0 +1,10 @@
|
||||
<script lang="ts" setup>
|
||||
import errorBound from "~/components/errorBound.vue";
|
||||
const p = defineProps<{ error: any }>();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<NuxtLayout>
|
||||
<error-bound :error="error" />
|
||||
</NuxtLayout>
|
||||
</template>
|
Loading…
Reference in New Issue
Block a user