Nuxt是一个全栈框架，这意味着在不同的上下文中，有几种不可避免的用户运行时错误来源:

1. Vue渲染生命周期中的错误(SSR + SPA)
2. API或Nitro服务器生命周期中的错误
3. 服务器和客户端启动错误(SSR + SPA)

//全局错误页面  error.vue
<template>
  <div class="pt-[50px]">
    <n-result
        status="500"
        title="错误提示"
        :description="error.message"
    >
        <template #icon>
            <img src="~/assets/img/sad.png" alt="喵星">
        </template>
        <template #footer>
            <n-button @click="$router.back()" mr-4>返回上一页</n-button>
            <n-button @click="handleError">回到首页</n-button>
        </template>
    </n-result>
  </div>
</template>

<script setup>
import { NButton, NResult } from "naive-ui"

defineProps({
  error: Object
})
const handleError = () => clearError({ redirect: '/' })
</script>