jsschools

useNuxtApp()

Accesses the Nuxt app instance: injected helpers, hooks, and runtime context.

Since Nuxt 3.0 Spec ↗

Syntax

const nuxtApp = useNuxtApp()

Returns

NuxtApp — The app context with $-prefixed providers, hooks, ssrContext, payload.

Examples

<script setup lang="ts">
const { $myPlugin } = useNuxtApp()
$myPlugin.doSomething()
</script>

// plugins/log.ts
export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.hook('page:finish', () => {
    console.log('page rendered')
  })
})

<script setup lang="ts">
const nuxtApp = useNuxtApp()
if (import.meta.server) {
  nuxtApp.payload.data ??= {}
}
</script>

Notes

Exposes plugin injections (e.g. `$router`, `$config`, custom `provide` values), the `hooks` system, `payload`, and `ssrContext`. Outside a component lifecycle, call within a plugin or wrap with `nuxtApp.runWithContext()` to keep async context. Calling outside a Nuxt context throws.

See also