⚠️
The vite-plugin-ssr project has been renamed Vike.
If you are using vite-plugin-ssr, migrate to Vike.
For new projects, use Vike instead of vite-plugin-ssr.
Vike itself (without extensions) is like vite-plugin-ssr: unopinionated and fully agnostic.

`.page.client.js`

Environment: browser.

The .page.client.js file defines the page's browser-side code.

It represents the entire browser-side code. This means that if we don't create any .page.client.js files, then our app has zero browser-side JavaScript. (Except for Vite's dev code when not in production.)

This also means that we have full control over the browser-side code. Not only can we render/hydrate our pages as we wish, but we can also easily & naturally integrate browser libraries.

// _default.page.client.js

export { render }

import { hydrate } from 'some-ui-framework'

async function render(pageContext) {
  const { Page } = pageContext
  await hydrate(Page)
}

The browser-side is usually about hydrating the page, but we can also do partial/island hydration, only install a couple of JavaScript event handlers, etc.

✍ Edit this page