vite-plugin-prerender

1.0.8 verified Mon Apr 27 auth: no javascript

A flexible, framework-agnostic Vite plugin for prerendering static HTML from single-page applications. Version 1.0.8 supports any framework (Vue, React, etc.) and offers customizable configuration including route selection, post-processing, minification, and server options. It uses Puppeteer under the hood via the prerenderer library. Release cadence is irregular; the plugin is largely feature-complete with occasional bug fixes. Differentiators include full Vite compatibility, ease of use, and support for custom renderers.

Common errors

error Error: Cannot find module 'puppeteer' ↓

cause Puppeteer not installed (it's a peer dependency).

fix

npm install puppeteer --save-dev

error TypeError: vitePrerender is not a function ↓

cause Using named import instead of default import.

fix

Change import from import { vitePrerender } from 'vite-plugin-prerender' to import vitePrerender from 'vite-plugin-prerender'

error Error: The 'staticDir' option is required. ↓

cause Missing staticDir in plugin configuration.

fix

Add staticDir: path.join(__dirname, 'dist') to the options object.

error Error: No routes provided. Please specify at least one route to prerender. ↓

cause Missing or empty routes array.

fix

Provide an array of route strings in the options, e.g., routes: ['/', '/about'].

Warnings

gotcha Plugin only works during vite build, not dev server. Hot reload won't trigger prerendering. ↓

fix Use vite build to generate prerendered output.

deprecated The `postProcess` function in v1.0.7 had a bug: if it didn't return a value, the route was dropped. This was fixed in v1.0.8. ↓

fix Upgrade to v1.0.8 or ensure postProcess always returns a renderedRoute object.

breaking Default export changed from named to default? Verify if any breaking changes between major versions (none identified so far).

gotcha Puppeteer is required as a peer dependency but not listed; must be installed separately. ↓

fix npm install puppeteer --save-dev

gotcha Routes must exactly match the client-side router paths; wildcards or glob patterns are not supported. ↓

fix List all routes explicitly or generate them programmatically.

Install

npm install vite-plugin-prerender

yarn add vite-plugin-prerender

pnpm add vite-plugin-prerender

Imports

default

wrong

import { vitePrerender } from 'vite-plugin-prerender'

correct

import vitePrerender from 'vite-plugin-prerender'

Default export only; named import will fail.

PuppeteerRenderer

wrong

import { PuppeteerRenderer } from 'vite-plugin-prerender'

correct

import vitePrerender from 'vite-plugin-prerender'; const PuppeteerRenderer = vitePrerender.PuppeteerRenderer

PuppeteerRenderer is a property on the default export, not a named export.

CommonJS require
```
const vitePrerender = require('vite-plugin-prerender')
```
CJS is supported for Node.js <12? ESM is recommended. Use .mjs or type: module for ESM.

Quickstart

Basic Vite configuration to prerender three routes into static HTML files.

import vitePrerender from 'vite-plugin-prerender';
import path from 'path';

export default () => ({
  plugins: [
    vitePrerender({
      staticDir: path.join(__dirname, 'dist'),
      routes: ['/', '/about', '/contact'],
    }),
  ],
});