生命周期钩子

Nuxt 提供了一个强大的钩子系统，可以通过钩子扩展几乎每个方面。
Read more in Docs > 4 X > Guide > Going Further > Hooks.

应用钩子（运行时）

查看 app 源代码 以获取所有可用的钩子。

Hook参数环境描述
app:createdvueApp服务器 & 客户端在初始 vueApp 实例创建时调用。
app:errorerr服务器 & 客户端在发生致命错误时调用。
app:error:cleared{ redirect? }服务器 & 客户端在致命错误被清除时调用。
vue:setup-服务器 & 客户端Nuxt 根的 setup 初始化时调用。此回调必须是同步的。
vue:errorerr, target, info服务器 & 客户端当 Vue 错误传播到根组件时调用。了解更多。
app:renderedrenderContext服务器SSR 渲染完成时调用。
app:redirected-服务器SSR 重定向前调用。
app:beforeMountvueApp客户端挂载应用前调用，仅在客户端执行。
app:mountedvueApp客户端Vue 应用初始化并挂载到浏览器时调用。
app:suspense:resolveappComponent客户端在 Suspense 解析事件时调用。
app:manifest:update{ id, timestamp }客户端当检测到应用有新版本时调用。
app:data:refreshkeys?客户端当调用 refreshNuxtData 时调用。
link:prefetchto客户端当观察到 <NuxtLink> 被预取时调用。
page:startpageComponent?客户端在 NuxtPage 中的 Suspense 挂起事件时调用。
page:finishpageComponent?客户端在 NuxtPage 中的 Suspense 解析事件时调用。
page:loading:start-客户端当新页面的 setup() 正在运行时调用。
page:loading:end-客户端在 page:finish 之后调用。
page:transition:finishpageComponent?客户端页面过渡的 onAfterLeave 事件之后调用。
dev:ssr-logslogs客户端当服务器端日志传递给客户端时调用（如果启用了 features.devLogs）。
page:view-transition:starttransition客户端当调用 document.startViewTransition 后调用（当启用了实验性视图过渡支持 时）。

Nuxt 钩子（构建时）

查看 schema 源代码 以获取所有可用钩子。

Hook参数描述
kit:compatibilitycompatibility, issues用于扩展兼容性检查。
readynuxtNuxt 初始化完成，实例已准备好工作时调用。
closenuxtNuxt 实例优雅关闭时调用。
restart{ hard?: boolean }用于重启当前 Nuxt 实例。
modules:before-Nuxt 初始化时，安装用户模块之前调用。
modules:done-Nuxt 初始化时，安装用户模块之后调用。
app:resolveapp解析 app 实例后调用。
app:templatesapp在生成 NuxtApp 期间调用，允许自定义、修改或添加新文件到构建目录（虚拟或写入 .nuxt）。
app:templatesGeneratedapp模板编译进 虚拟文件系统 (vfs) 后调用。
build:before-Nuxt 打包构建前调用。
build:done-Nuxt 打包构建完成后调用。
build:manifestmanifest在 Vite 和 webpack 生成清单时调用，允许自定义 Nitro 用于渲染最终 HTML 中 <script> 和 <link> 标签的清单。
builder:generateAppoptions生成应用前调用。
builder:watchevent, path开发构建时，当观察器检测到项目文件或目录变动时调用。
pages:extendpages文件系统扫描页面路由后调用。
pages:resolvedpages页面路由已添加扫描元数据后调用。
pages:routerOptions{ files: Array<{ path: string, optional?: boolean }> }解析 router.options 文件时调用，后续数组项会覆盖前面。
server:devHandlerhandler在 Nitro 开发服务器上注册开发中间件时调用。
imports:sourcespresets设置阶段允许模块扩展导入源。
imports:extendimports设置阶段允许模块扩展导入。
imports:contextcontext当创建 unimport 上下文时调用。
imports:dirsdirs允许扩展导入目录。
components:dirsdirs在 app:resolve 内部调用，允许扩展自动导入组件扫描目录。
components:extendcomponents允许扩展新组件。
nitro:confignitroConfigNitro 初始化前调用，允许定制 Nitro 配置。
nitro:initnitroNitro 初始化后调用，允许注册 Nitro 钩子及直接与 Nitro 交互。
nitro:build:beforenitro构建 Nitro 实例前调用。
nitro:build:public-assetsnitro复制公共资源后调用，允许在 Nitro 服务器构建前修改公共资源。
prerender:routesctx允许扩展预渲染路由。
build:errorerror构建时发生错误时调用。
prepare:typesoptions在 @nuxt/cli 写入 TypeScript 配置文件（.nuxt/tsconfig.app.json、.nuxt/tsconfig.server.json 等）及 .nuxt/nuxt.d.ts 前调用，允许添加自定义引用、声明或直接修改生成配置中的选项。
listenlistenerServer, listener开发服务器启动时调用。
schema:extendschemas允许扩展默认 schema。
schema:resolvedschema允许扩展已解析的 schema。
schema:beforeWriteschema在写入给定 schema 前调用。
schema:written-schema 写入后调用。
vite:extendviteBuildContext允许扩展 Vite 默认上下文。
vite:extendConfigviteInlineConfig, env允许扩展 Vite 默认配置。Nuxt 5+ 已废弃。 在 Nuxt 5 中，此钩子作用于共享配置而非独立的客户端/服务器配置。
vite:configResolvedviteInlineConfig, env允许读取已解析的 Vite 配置。Nuxt 5+ 已废弃。 在 Nuxt 5 中，此钩子作用于共享配置而非独立的客户端/服务器配置。
vite:serverCreatedviteServer, envVite 服务器创建时调用。
vite:compiled-Vite 服务器编译完成后调用。
webpack:configwebpackConfigs配置 webpack 编译器前调用。
webpack:configResolvedwebpackConfigs允许读取已解析的 webpack 配置。
webpack:compileoptions编译前调用。
webpack:compiledoptions资源加载后调用。
webpack:changeshortPathWebpackBar 监听 change 时调用。
webpack:error-WebpackBar 完成时若有错误调用。
webpack:done-WebpackBar 全部完成时调用。
webpack:progressstatesArrayWebpackBar 进度事件时调用。

Nitro 应用钩子（运行时，服务器端）

参考 Nitro 获取所有可用钩子。

Hook参数描述类型
dev:ssr-logs{ path, logs }服务器端请求周期结束时调用，带有传递给客户端的服务器日志数组。
render:responseresponse, { event }在发送响应之前调用。response, event
render:htmlhtml, { event }在构建 HTML 之前调用。html, event
render:islandislandResponse, { event, islandContext }在构建 island HTML 之前调用。islandResponse, event, islandContext
close-Nitro 关闭时调用。-
errorerror, { event? }发生错误时调用。error, event
requestevent收到请求时调用。event
beforeResponseevent, { body }发送响应前调用。event, unknown
afterResponseevent, { body }发送响应后调用。event, unknown