prerender() programmatic

See Guides > Pre-rendering (SSG) for an overview of what pre-rendering is and how to enable it.

Pre-rendering is automatically initiated when running $ vite build. (If pre-rendering is enabled.)

Instead, we can programmatically initiate pre-rendering:

// vite.config.js

import { ssr } from 'vite-plugin-ssr/plugin'

export default {
  plugins: [
    ssr({
      prerender: {
        // Stop `$ vite build` from initiating pre-rendering
        disableAutoRun: true
      }
    })
  ]
}
// my-custom-build-script.js

import { prerender } from 'vite-plugin-ssr/prerender'

// Without options
prerender()

// All options are optional
prerender({
  pageContextInit,
  viteConfig,
  onPagePrerender
})

pageContextInit

The initial value of each page's pageContext object.

prerender({
  pageContextInit: {
    someData: 42,
    // ...
  }
})

viteConfig

The Vite config.

It's optional: if omitted, Vite automatically loads our vite.config.js.

We recommend to either omit this option or set it to prerender({ viteConfig: { root }}): the vite.config.js file living at root will be loaded.

Alternatively you can:

  • Set: 
    prerender({
  viteConfig: {
    configFile: require.resolve('./path/to/vite.config.js')
  }
})
  • Not load any vite.config.js file and, instead, use prerender({ viteConfig: { configFile: false, ...myViteConfig }}) to programmatically define the entire Vite config.

You can also load a vite.config.js file while overriding parts of the Vite config.

See Vite > JavaScript API > InlineConfig.

onPagePrerender()

⚠ DON'T use this option without having contacted a vite-plugin-ssr maintainer: this functionality may be completely changed/removed at anytime if you don't.
⚠ This feature is experimental and may be changed in any minor version update.

The onPagePrerender option allows us to override where the HTML is written.

prerender({
  // If we provide `onPagePrerender` then vite-plugin-ssr won't write the HTML to the filesystem
  onPagePrerender(pageContext) {
    // TODO: write the HTML to the filesystem.
    // ...
  }
})

More configs

For more configurations, see the global config at API > prerender config.