+client.js

You can define a +client.js file to add client-side JavaScript.

It's usually used for initializing error tracking, user tracking, cookie consent, CSS frameworks, etc.

// /pages/+client.js
// Environment: client
 
console.log("I'm the first line of client-side JavaScript.")

In production, it's the very first JavaScript code to be executed. In development, it's run first after Vite's HMR preamble.

The code of +client.js isn't re-executed upon client-side page navigation. For executing code upon the lifecycle of page rendering, see following hooks instead:

• API > onHydrationEnd() hook
• onAfterRenderClient() hook
• onBeforeRenderClient() hook
• API > onPageTransitionStart() hook
• API > onPageTransitionEnd() hook

Currently, +client.js isn't cumulative but it's work-in-progress, see 1834 - Make +client.js cumulative.

Examples

• /examples/render-modes/pages/html-js/+client.js
• Render Modes (SPA, SSR, SSG, HTML-only) > HTML-only

See also

• API > onHydrationEnd() hook
• onAfterRenderClient() hook
• onBeforeRenderClient() hook
• API > onPageTransitionStart() hook
• API > onPageTransitionEnd() hook