라이프사이클 훅

Nuxt는 훅을 사용하여 거의 모든 측면을 확장할 수 있는 강력한 훅 시스템을 제공합니다.

앱 훅 (런타임)

사용 가능한 모든 훅은 앱 소스 코드를 확인하세요.

Hook	Arguments	Environment	Description
`app:created`	`vueApp`	서버 & 클라이언트	초기 `vueApp` 인스턴스가 생성될 때 호출됩니다.
`app:error`	`err`	서버 & 클라이언트	치명적인 오류가 발생할 때 호출됩니다.
`app:error:cleared`	`{ redirect? }`	서버 & 클라이언트	치명적인 오류가 발생할 때 호출됩니다.
`vue:setup`	-	서버 & 클라이언트	Nuxt 루트의 설정이 초기화될 때 호출됩니다. 이 콜백은 동기적으로 실행되어야 합니다.
`vue:error`	`err, target, info`	서버 & 클라이언트	vue 오류가 루트 컴포넌트로 전파될 때 호출됩니다. 자세히 알아보기.
`app:rendered`	`renderContext`	서버	SSR 렌더링이 완료되면 호출됩니다.
`app:redirected`	-	서버	SSR 리디렉션 전에 호출됩니다.
`app:beforeMount`	`vueApp`	클라이언트	앱을 마운트하기 전에 호출되며, 클라이언트 측에서만 호출됩니다.
`app:mounted`	`vueApp`	클라이언트	Vue 앱이 브라우저에서 초기화되고 마운트될 때 호출됩니다.
`app:suspense:resolve`	`appComponent`	클라이언트	Suspense 해결 이벤트에서 호출됩니다.
`app:manifest:update`	`{ id, timestamp }`	클라이언트	앱의 새로운 버전이 감지되었을 때 호출됩니다.
`app:data:refresh`	`keys?`	클라이언트	`refreshNuxtData`가 호출될 때 호출됩니다.
`link:prefetch`	`to`	클라이언트	`<NuxtLink>`가 프리페치될 때 관찰되면 호출됩니다.
`page:start`	`pageComponent?`	클라이언트	`NuxtPage` 대기 이벤트 내의 Suspense에서 호출됩니다.
`page:finish`	`pageComponent?`	클라이언트	`NuxtPage` 해결 이벤트 내의 Suspense에서 호출됩니다.
`page:loading:start`	-	클라이언트	새 페이지의 `setup()`이 실행될 때 호출됩니다.
`page:loading:end`	-	클라이언트	`page:finish` 후에 호출됩니다.
`page:transition:finish`	`pageComponent?`	클라이언트	페이지 전환 후 onAfterLeave 이벤트에서 호출됩니다.
`dev:ssr-logs`	`logs`	클라이언트	서버 측 로그 배열이 클라이언트로 전달될 때 호출됩니다 (`features.devLogs`가 활성화된 경우).
`page:view-transition:start`	`transition`	클라이언트	실험적 viewTransition 지원이 활성화된 경우 `document.startViewTransition`이 호출된 후 호출됩니다.

Nuxt 훅 (빌드 타임)

사용 가능한 모든 훅은 스키마 소스 코드를 확인하세요.

Hook	Arguments	Description
`kit:compatibility`	`compatibility, issues`	호환성 검사를 확장할 수 있습니다.
`ready`	`nuxt`	Nuxt 초기화 후, Nuxt 인스턴스가 작업할 준비가 되었을 때 호출됩니다.
`close`	`nuxt`	Nuxt 인스턴스가 정상적으로 종료될 때 호출됩니다.
`restart`	`{ hard?: boolean }`	현재 Nuxt 인스턴스를 재시작하기 위해 호출됩니다.
`modules:before`	-	Nuxt 초기화 중, 사용자 모듈 설치 전에 호출됩니다.
`modules:done`	-	Nuxt 초기화 중, 사용자 모듈 설치 후에 호출됩니다.
`app:resolve`	`app`	`app` 인스턴스가 해결된 후 호출됩니다.
`app:templates`	`app`	`NuxtApp` 생성 중, 빌드 디렉토리에 새로운 파일을 커스터마이징, 수정 또는 추가할 수 있도록 호출됩니다 (가상으로 또는 `.nuxt`에 작성).
`app:templatesGenerated`	`app`	템플릿이 가상 파일 시스템 (vfs)으로 컴파일된 후 호출됩니다.
`build:before`	-	Nuxt 번들 빌더 전에 호출됩니다.
`build:done`	-	Nuxt 번들 빌더가 완료된 후 호출됩니다.
`build:manifest`	`manifest`	Vite 및 webpack에 의해 매니페스트 빌드 중 호출됩니다. Nitro가 최종 HTML에서 `<script>` 및 `<link>` 태그를 렌더링하는 데 사용할 매니페스트를 커스터마이징할 수 있습니다.
`builder:generateApp`	`options`	앱을 생성하기 전에 호출됩니다.
`builder:watch`	`event, path`	개발 중 빌드 타임에 프로젝트의 파일 또는 디렉토리에 변경 사항이 감지되면 호출됩니다.
`pages:extend`	`pages`	파일 시스템에서 페이지 경로가 스캔된 후 호출됩니다.
`pages:resolved`	`pages`	페이지 경로가 스캔된 메타데이터로 보강된 후 호출됩니다.
`pages:routerOptions`	`{ files: Array<{ path: string, optional?: boolean }> }`	`router.options` 파일을 해결할 때 호출됩니다. 배열의 나중 항목이 이전 항목을 덮어씁니다.
`server:devHandler`	`handler`	Nitro 개발 서버에 개발 미들웨어가 등록될 때 호출됩니다.
`imports:sources`	`presets`	모듈이 소스를 확장할 수 있도록 설정 시 호출됩니다.
`imports:extend`	`imports`	모듈이 임포트를 확장할 수 있도록 설정 시 호출됩니다.
`imports:context`	`context`	unimport 컨텍스트가 생성될 때 호출됩니다.
`imports:dirs`	`dirs`	임포트 디렉토리를 확장할 수 있습니다.
`components:dirs`	`dirs`	`app:resolve` 내에서 호출되어 자동 임포트 가능한 컴포넌트를 스캔할 디렉토리를 확장할 수 있습니다.
`components:extend`	`components`	새로운 컴포넌트를 확장할 수 있습니다.
`nitro:config`	`nitroConfig`	Nitro 초기화 전에 호출되어 Nitro의 구성을 커스터마이징할 수 있습니다.
`nitro:init`	`nitro`	Nitro가 초기화된 후 호출되어 Nitro 훅을 등록하고 Nitro와 직접 상호작용할 수 있습니다.
`nitro:build:before`	`nitro`	Nitro 인스턴스를 빌드하기 전에 호출됩니다.
`nitro:build:public-assets`	`nitro`	공개 자산을 복사한 후 호출됩니다. Nitro 서버가 빌드되기 전에 공개 자산을 수정할 수 있습니다.
`prerender:routes`	`ctx`	사전 렌더링할 경로를 확장할 수 있습니다.
`build:error`	`error`	빌드 타임에 오류가 발생할 때 호출됩니다.
`prepare:types`	`options`	`@nuxt/cli`가 `.nuxt/tsconfig.json` 및 `.nuxt/nuxt.d.ts`를 작성하기 전에 호출되어 `nuxt.d.ts`에 사용자 정의 참조 및 선언을 추가하거나 `tsconfig.json`의 옵션을 직접 수정할 수 있습니다.
`listen`	`listenerServer, listener`	개발 서버가 로드될 때 호출됩니다.
`schema:extend`	`schemas`	기본 스키마를 확장할 수 있습니다.
`schema:resolved`	`schema`	해결된 스키마를 확장할 수 있습니다.
`schema:beforeWrite`	`schema`	주어진 스키마를 작성하기 전에 호출됩니다.
`schema:written`	-	스키마가 작성된 후 호출됩니다.
`vite:extend`	`viteBuildContext`	Vite 기본 컨텍스트를 확장할 수 있습니다.
`vite:extendConfig`	`viteInlineConfig, env`	Vite 기본 구성을 확장할 수 있습니다.
`vite:configResolved`	`viteInlineConfig, env`	해결된 Vite 구성을 읽을 수 있습니다.
`vite:serverCreated`	`viteServer, env`	Vite 서버가 생성될 때 호출됩니다.
`vite:compiled`	-	Vite 서버가 컴파일된 후 호출됩니다.
`webpack:config`	`webpackConfigs`	webpack 컴파일러를 구성하기 전에 호출됩니다.
`webpack:configResolved`	`webpackConfigs`	해결된 webpack 구성을 읽을 수 있습니다.
`webpack:compile`	`options`	컴파일 직전에 호출됩니다.
`webpack:compiled`	`options`	리소스가 로드된 후 호출됩니다.
`webpack:change`	`shortPath`	WebpackBar에서 `change` 시 호출됩니다.
`webpack:error`	-	WebpackBar에서 오류가 있을 때 `done` 시 호출됩니다.
`webpack:done`	-	WebpackBar에서 `allDone` 시 호출됩니다.
`webpack:progress`	`statesArray`	WebpackBar에서 `progress` 시 호출됩니다.

Nitro 앱 훅 (런타임, 서버 사이드)

사용 가능한 모든 훅은 Nitro를 참조하세요.

Hook	Arguments	Description	Types
`dev:ssr-logs`	`{ path, logs }`	서버	요청 사이클 끝에 서버 측 로그 배열과 함께 호출됩니다.
`render:response`	`response, { event }`	응답을 보내기 전에 호출됩니다.	response, event
`render:html`	`html, { event }`	HTML을 구성하기 전에 호출됩니다.	html, event
`render:island`	`islandResponse, { event, islandContext }`	아일랜드 HTML을 구성하기 전에 호출됩니다.	islandResponse, event, islandContext
`close`	-	Nitro가 닫힐 때 호출됩니다.	-
`error`	`error, { event? }`	오류가 발생할 때 호출됩니다.	error, event
`request`	`event`	요청이 수신될 때 호출됩니다.	event
`beforeResponse`	`event, { body }`	응답을 보내기 전에 호출됩니다.	event, unknown
`afterResponse`	`event, { body }`	응답을 보낸 후에 호출됩니다.	event, unknown

※이 페이지는 Nuxt.js 공식 문서의 비공식 번역 페이지입니다.

공식 문서의 해당 페이지는 여기 있습니다:
https://nuxt.com/docs/3.x/api/advanced/hooks