Vercel

vite-plugin-vercel

We can use vite-plugin-vercel to deploy to Vercel.

vite-plugin-vercel is in Beta.

Manual

We can also manually setup Vercel:

1. Load dist/server/importBuild.js in your Vercel serverless function. Example: /examples/vercel/vercel/render.js.

   Behind the scenes, Vercel bundles your serverless function and therefore needs to know its entire dependency tree; importBuild.js enables Vercel to discover the entire dependency tree of your serverless function.

2. Define a deploy.sh script. Example: /examples/vercel/vercel/deploy.sh.

3. Define package.json#scripts['vercel-build'] along with package.json#scripts.build. Example: /examples/vercel/package.json.

   Vercel discards all files generated by package.json#scripts.build. That's why we need to use package.json#scripts['vercel-build'].

While/after adding your Git repository to Vercel, set the following in Vercel's web UI:

1. Set FRAMEWORK PRESET to Other.

2. Add a new environment variable named ENABLE_FILE_SYSTEM_API and set its value to 1.

ISR

We can use Vercel's Incremental Static Regeneration (ISR) by using vite-plugin-vercel which has ISR support.

See also

• dist/server/importBuild.js
• Vercel Docs - Custom Build Step for Node.js.
• Insightful conversation: github.com/vercel/vercel/discussions/6393.
• vercel.json's config includeFiles doesn't work for files that are not committed to your Git repository: github.com/vercel/vercel/issues/6478.