⚠️
The vite-plugin-ssr project has been renamed Vike.
  • If you are already using vite-plugin-ssr then migrate to Vike.
  • For new projects, don't use vite-plugin-ssr but use Vike instead.

Cloudflare Pages

By pre-rendering your pages, you can remove the need for a production server. You can then deploy your app to any static host, such as Cloudflare Pages.

Static hosts always expect one .html file per URL. This means you need to pre-render all your pages, regardless of render mode. For example, if you have SPA pages, then you also need to pre-render them which will generate .html files with an empty <body>.

You can choose between following deploy strategies:

  • Build locally and upload dist/client/ to Cloudflare Pages.
  • Let a GitHub action build and upload dist/client/ to Cloudflare Pages.
  • Let Cloudflare Pages build your app.

The $ vite build command generates dist/client/ containing all static assets.

If you let Cloudflare Pages build your app, note that vite-plugin-ssr requires Node.js >=12.19.0 and you may need to change Cloudflare Pages' default Node.js version.

You can try out your production build locally with $ vite preview, or any other tool such as $ serve dist/client/.

If you don't deploy your app at your domain root https://my-domain.com, but at https://my-domain.com/somewhere/nested instead, then change your app's Base URL.

Wrangler 2 & Cloudflare Worker

With wrangler v2, you can deploy a Cloudflare Worker (server code) along Cloudflare Pages.

See Deploy > Cloudflare Workers > Cloudflare Pages.

Example

Example of using vite-plugin-ssr with Cloudflare Pages and Cloudflare Workers: