Api

Nuxt App Hooks

Use Nuxt App hooks to extend the Nuxt Scripts runtime behavior.

scripts:updated

  • Type: async (ctx: { scripts: ScriptRegistry }) => HookResult

Triggered after the script status is updated.

This is used internally for the DevTools but can be used however you see fit.

plugins/nuxt-scripts.ts
export default defineNuxtPlugin({
  setup() {
    useNuxtApp().hooks.hook('scripts:updated', (ctx) => {
      console.log('Scripts updated', ctx.scripts)
    })
  }
})

script:instance-fn

  • Type: (ctx: { script: ScriptInstance<any>, fn: string | symbol, args: any, exists: boolean }) => HookResult

This is exposed only from Unhead, it's fired when accessing properties via the proxy instance.

This is also used internally for the DevTools but can be used however you see fit.

export default defineNuxtPlugin({
  setup() {
    const head = injectHead()
    head.hooks.hook('script:instance-fn', ({ fn, args }) => {
      console.log('Function called:', ctx)
    })
    const { proxy } = useScript()
    proxy.doSomething() // Function called: doSomething
  }
})