{"id":42227,"library":"vite-plugin-html-prerender","title":"Vite Plugin HTML Prerender","description":"Vite.js plugin for pre-rendering HTML for SPAs. Current stable version is 0.2.0, with a low release cadence. It allows pre-rendering specified routes at build time, generating static HTML files to improve SEO and initial load performance. Differentiators include a simple configuration API, support for custom selectors to wait for content, and optional HTML minification via html-minifier. It is designed specifically for Vite and works with both JavaScript and TypeScript projects.","status":"active","version":"0.2.0","language":"javascript","source_language":"en","source_url":"https://github.com/saeedafzal/vite-plugin-html-prerender","tags":["javascript","vite","vite-plugin","typescript"],"install":[{"cmd":"npm install vite-plugin-html-prerender","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-html-prerender","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-html-prerender","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"The plugin exports a named function, not a default export.","wrong":"import htmlPrerender from 'vite-plugin-html-prerender'","symbol":"htmlPrerender","correct":"import { htmlPrerender } from 'vite-plugin-html-prerender'"},{"note":"CommonJS require is not supported because the package is ESM-only.","wrong":"const htmlPrerender = require('vite-plugin-html-prerender');","symbol":"(plugin usage)","correct":"import { htmlPrerender } from 'vite-plugin-html-prerender'; export default defineConfig({ plugins: [htmlPrerender({...})] })"},{"note":"Available if you need TypeScript types for the options object.","wrong":"","symbol":"type HtmlPrerenderOptions","correct":"import type { HtmlPrerenderOptions } from 'vite-plugin-html-prerender'"}],"quickstart":{"code":"// vite.config.ts\nimport { defineConfig } from 'vite';\nimport { htmlPrerender } from 'vite-plugin-html-prerender';\nimport path from 'path';\n\nexport default defineConfig({\n  plugins: [\n    htmlPrerender({\n      staticDir: path.join(__dirname, 'dist'),\n      routes: ['/', '/about'],\n      selector: '#root',\n      minify: {\n        collapseBooleanAttributes: true,\n        collapseWhitespace: true,\n        decodeEntities: true,\n        keepClosingSlash: true,\n        sortAttributes: true\n      }\n    })\n  ]\n});","lang":"typescript","description":"Configures the plugin to pre-render '/' and '/about' routes, waiting for '#root' selector, with HTML minification enabled."},"warnings":[{"fix":"Set 'staticDir' to the same directory as your Vite's 'build.outDir' (default 'dist').","message":"The plugin requires that your Vite build output is a static directory (e.g., 'dist'). Ensure the 'staticDir' points to the actual build output directory.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Set 'selector' to the correct query selector for your app's root element (e.g., 'main' or '#app').","message":"The 'selector' option defaults to '#root'. If your SPA renders into a different element, you must specify it or the plugin may finish before your app is ready.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Ensure your routes are fully rendered after the page loads. You can also increase the timeout or use a custom navigation behavior.","message":"The plugin's pre-rendering uses Puppeteer internally, which may fail if your site uses client-side features that rely on user interaction (e.g., lazy loading, infinite scroll).","severity":"gotcha","affected_versions":">=0.0.0"}],"env_vars":null,"search_vec":"'0.2.0':18 'allow':25 'api':50 'build':32 'cadenc':23 'configur':49 'content':58 'current':14 'custom':53 'design':69 'differenti':45 'file':37 'generat':34 'html':3,11,36,61,65 'html-minifi':64 'improv':39 'includ':46 'initi':42 'javascript':77,81 'load':43 'low':21 'minif':62 'minifi':66 'option':60 'perform':44 'plugin':2,6,85 'pre':9,27 'pre-rend':8,26 'prerend':4 'project':80 'releas':22 'render':10,28 'rout':30 'selector':54 'seo':40 'simpl':48 'spas':13 'specif':70 'specifi':29 'stabl':15 'static':35 'support':51 'time':33 'typescript':79,86 'version':16 'via':63 'vite':1,72,82,84 'vite-plugin':83 'vite.js':5 'wait':56 'work':74","created_at":"2026-06-04T18:56:14.371954+00:00","updated_at":"2026-06-04T18:56:14.371954+00:00","problems":[{"fix":"Use 'import' syntax in an ESM context. If your package.json doesn't have \"type\": \"module\", rename your vite config to .mjs or .mts.","cause":"The package is ESM-only and cannot be required with CommonJS.","error":"Cannot find module 'vite-plugin-html-prerender'"},{"fix":"Ensure the directory exists before running vite build, or adjust 'staticDir' to match your build output directory.","cause":"The 'staticDir' path does not exist or is incorrect.","error":"ENOENT: no such file or directory, scandir 'dist'"},{"fix":"Wrap client-side code that uses 'window' in a check for 'typeof window !== \"undefined\"'.","cause":"The pre-rendering environment (Node.js) does not have a global window object, and your code may be accessing it before the DOM is ready.","error":"Error: Evaluation failed: ReferenceError: window is not defined"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://github.com/saeedafzal/vite-plugin-html-prerender#readme","github":"https://github.com/saeedafzal/vite-plugin-html-prerender","docs":null,"changelog":null,"pypi":null,"npm":"vite-plugin-html-prerender","openapi_spec":null,"status_page":null,"smithery":null,"categories":["devops"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-04","next_check":"2026-09-02","install_tag":null}}