You can deploy Vike to Vercel simply by using a Vercel API Route. Alternatively, you can use vite-plugin-vercel for a full-fleged Vercel integration with ISR and Edge Middlewares.

We recommend using the Vercel API Route technique because it's a simple and sturdy integration. Later, if the need arises, you can switch to vite-plugin-vercel.

You can use Bati to scaffold a Vike app that uses Vercel.

API Route

You can integrate Vercel simply by creating a Vercel API Route api/ssr.js that server-side renders your app.


Make sure to properly set OUTPUT DIRECTORY in your Vercel dashboard, see the example's instructions.

Using a Vercel API Route is a sturdy way to deploy to Vercel, as API Routes is a core Vercel feature: it's here to stay and, most importantly, stable. (Whereas Vercel's Build Output API is a moving target with occasional breaking changes.) Once you've set the server-side rendering API Route, you can expect it to work for the foreseeable future.


vite-plugin-vercel enables zero-configuration support for all Vercel features, including Incremental Static Regeneration (ISR) and Edge Middlewares.

If you pre-render your pages only partially, you can also use vite-plugin-vercel to statically deploy your pre-rendered pages while dynamically serving your non-prerendered pages.

See Vike + vite-plugin-vercel installation instructions at vite-plugin-vercel > Usage with Vike.

Under the hood, vite-plugin-vercel uses Vercel's Build Output API.

Build Output API

For maximum flexibility and configuration options, you can directly use the Build Output API.


Data APIs (GraphQL, RESTful, RPC)

Vercel API Routes only work on Vercel's platform; you cannot run them locally.

This means that you need to integrate your data layer twice:

  1. Using Vercel's API Routes, for Vercel deployment.
  2. Using a local server (e.g. Express.js), for development.

This is usually easy to achieve as most data layer tools integrate using a single HTTP endpoint. For example:

  • GraphQL integrates over a single HTTP endpoint /graphql.
  • Telefunc integrates over a single HTTP endpoint /_telefunc.
  • tRPC integrates over a single HTTP endpoint as well.

In other words, you can add a data layer by:

  • Creating a new Vercel API Route, integrating that single endpoint.
  • Creating a new route to your local development server (e.g. Express.js), integrating that single endpoint.

When using SSR, we recommend using RPC instead of GraphQL, leading to a substantial simplification and increased development speed.