Environment: server, client.

Implemented by: vike-vue.

You need vike-vue to be able to use onCreateApp().

The onCreateApp() hook is called right after the Vue app is created, giving you the opportunity to extend it, typically for registering a Vue plugin.

// pages/+onCreateApp.js
// Environment: server, client
 
export { onCreateApp }
 
import SomeVuePlugin from 'some-vue-plugin'
 
const onCreateApp = (pageContext) => {
  if (pageContext.isRenderingHead) return // Don't add the plugin when rendering <head>
  const { app } = pageContext
  app.use(SomeVuePlugin)
}

There are two app instances: one for rendering the +Page.vue component, and a second one for rendering the +Head.vue components. You can use pageContext.isRenderingHead for applying onCreateApp() only for rendering the +Page.vue component.

Examples

See vike-vue > /examples/full/pages/+onCreateApp.ts

TypeScript

// /pages/+onCreateApp.ts
// Environment: server, client
 
export { onCreateApp }
 
import type { OnCreateAppSync } from 'vike-vue'
import SomeVuePlugin from 'some-vue-plugin'
 
const onCreateApp: OnCreateAppSync = (pageContext): ReturnType<OnCreateAppSync> => {
  const { app } = pageContext
  app.use(SomeVuePlugin)
}

See also