List of built-in hooks. (You can create your own.)

See also: API > Settings.

Basics

• data(): server (configurable) Called before the page is rendered, for fetching data.
• guard(): server (configurable) Protect pages from unprivileged access.
• onHydrationEnd(): client Called after the page is hydrated.
• onPageTransitionStart(): client Called upon page navigation, before the new page starts rendering.
• onPageTransitionEnd(): client Called upon page navigation, after the new page has finished rendering.
• onCreatePageContext(): server & client Hook called when a pageContext object is created.
• onCreateGlobalContext(): server & client Hook called when the globalContext object is created.

Pre-rendering

• onBeforePrerenderStart(): server Called before the whole Pre-rendering process starts.
• onPrerenderStart(): server Global hook called when Pre-rendering starts.

vike-vue

• onCreateApp(): server & client vike-vue Called after creating Vue's app instance.

Advanced

Most users don't need to know about these hooks.

• onData(): server & client Called as soon as pageContext.data is available.
• onBeforeRender(): server (configurable) Called before the page is rendered, lower-level and usually for advanced integrations with data fetching tools.
• onRenderHtml(): server Called when a page is rendered to HTML on the server-side.
• onRenderClient(): client Called when a page is rendered on the client-side.
• onBeforeRoute(): server & client Called before the URL is routed to a page.
• onBeforeRenderClient(): client Called at the beginning of onRenderClient().
• onAfterRenderClient(): client Called at the end of onRenderClient().
• onBeforeRenderHtml(): server Called at the beginning of onRenderHtml().
• onAfterRenderHtml(): server Called at the end of onRenderHtml().

Upcoming

Potentially upcoming hooks:

• Feature Request #1979 — New hook onRenderHtmlEnd()
• Feature Request #1438 — New hook onLog()
• Feature Request #1525 — New hook onRenderContent(): generate non-HTML files with arbitrary content

Lifecycle

The order in which hooks are called upon rendering a page. (The hook flow.)

Data hook environment

Select the following:

• Server-only (default) if you use +data.js or +onBeforeRender.js. (They run only on the server.)
• Client-only if you use +data.client.js or +onBeforeRender.client.js. (They run only on the client.)
• Server & client if you use +data.shared.js or +onBeforeRender.shared.js. (They run on both the server and the client.)

Routing executes the Route Function of all your pages.

See also:

• API > pageContext > Lifecycle
• API > globalContext > Lifecycle

See also

• API > Settings
• API > Config Files