defineNuxtPlugin()

Defines a Nuxt plugin to inject helpers and hook into the app lifecycle.

Since Nuxt 3.0 Spec ↗

Syntax

export default defineNuxtPlugin((nuxtApp) => { ... })

Parameters

NameTypeRequiredDescription
plugin (nuxtApp) => void | { provide } | object Yes A setup function, or an object with `name`, `enforce`, `setup`, `hooks`, `env`, and `parallel` for advanced ordering.

Returns

Plugin — Auto-registered plugin (file order in plugins/).

Examples

// plugins/hello.ts
export default defineNuxtPlugin(() => {
  return {
    provide: {
      hello: (name: string) => `Hello ${name}`,
    },
  }
})
// usage: const { $hello } = useNuxtApp()
// plugins/client-only.client.ts — runs only in browser
export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.hook('app:mounted', () => {
    console.log('mounted')
  })
})
export default defineNuxtPlugin({
  name: 'my-plugin',
  enforce: 'pre',
  async setup(nuxtApp) {
    await loadConfig()
  },
})

Notes

Files in `plugins/` are auto-registered in alphabetical order; `.client` / `.server` suffixes restrict the environment. Returning `{ provide }` injects `$`-prefixed helpers accessible via `useNuxtApp()`. Use `enforce: 'pre'|'post'` and `dependsOn` for ordering.

See also