ライフサイクルフック・Nuxt API

ドキュメント > ガイド > 詳細 > フックで詳細をご覧ください。

アプリケーションフック（ランタイム）

使用可能なすべてのフックについては、アプリケーションのソースコードを確認してください。

フック	引数	環境	説明
`app:created`	`vueApp`	サーバーとクライアント	最初の`vueApp`インスタンスが作成されたときに呼び出されます。
`app:error`	`err`	サーバーとクライアント	致命的なエラーが発生したときに呼び出されます。
`app:error:cleared`	`{ redirect? }`	サーバーとクライアント	致命的なエラーが発生したときに呼び出されます。
`app:data:refresh`	`keys?`	サーバーとクライアント	(内部)
`vue:setup`	-	サーバーとクライアント	(内部)
`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 }`	クライアント	アプリケーションの新しいバージョンが検出されたときに呼び出されます。
`link:prefetch`	`to`	クライアント	`<NuxtLink>` がプリフェッチされることが検出されたときに呼び出されます。
`page:start`	`pageComponent?`	クライアント	Suspense の保留イベント時に呼び出されます。
`page:finish`	`pageComponent?`	クライアント	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フック（ビルド時）

使用可能なすべてのフックについては、スキーマのソースコードを確認してください。

フック	引数	説明
`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`	Nuxiが`.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を参照してください。

フック	引数	説明	型
`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 Kitユーティリティの使用例。

Import meta

`import.meta`を使用してコードの実行場所を理解します。