bun-src/docs/guides/deployment/vercel.mdx

---
title: Deploy a Bun application on Vercel
sidebarTitle: Deploy on Vercel
mode: center
---

[Vercel](https://vercel.com/) is a cloud platform for building, deploying, and scaling apps. Vercel Functions can run on the Bun runtime, either behind a framework that Vercel supports or as a [`Bun.serve()`](/runtime/http/server) server.

<Warning>
  The Bun runtime on Vercel is in Beta. Automatic source maps, bytecode caching, and request metrics for `node:http` and
  `node:https` are not supported yet (request metrics for `fetch` are). See [feature
  support](https://vercel.com/docs/functions/runtimes/bun#feature-support) in the Vercel documentation.
</Warning>

---

<Steps>
	<Step title="Configure Bun in vercel.json">
		To run your Functions on Bun, add a [`bunVersion`](https://vercel.com/docs/project-configuration/vercel-json#bunversion) field to your `vercel.json` file:

    	```json vercel.json icon="file-json"
    	{
    		"bunVersion": "1.x" // [!code ++]
    	}
    	```

    	The value must be `"1.x"`; Vercel manages the minor and patch versions.

    	For best results, match your local Bun version with the version Vercel uses.
    </Step>

    <Step title="Add a server">
    	Choose how requests reach your code.

    	<Tabs>
    		<Tab title="Bun.serve() for the whole app">
    			Vercel's Bun framework preset sends every request for the deployment to a single `Bun.serve()` server. Vercel uses the preset when the project sets `bunVersion`, has a `bun.lock` file, and has a server entrypoint at one of these paths:

    			- `server.{js,cjs,mjs,ts,cts,mts}`
    			- `src/server.{js,cjs,mjs,ts,cts,mts}`

    			`bun install` creates `bun.lock` on Bun 1.2 or later. On older versions, run `bun install --save-text-lockfile`. The preset does not detect the binary `bun.lockb` format.

    			Call `Bun.serve()` once while the module loads. Vercel detects that call and routes incoming requests to it. Vercel supports the `fetch`, [`routes`](/runtime/http/routing), `error`, and `websocket` options:

    			```ts server.ts icon="/icons/typescript.svg"
    			Bun.serve({
    				routes: {
    					"/health": () => Response.json({ status: "ok" }),
    				},
    				fetch() {
    					return new Response("Hello from Bun on Vercel");
    				},
    			});
    			```

    			A minimal project is `package.json`, `bun.lock`, `server.ts`, and the `vercel.json` from the previous step. It doesn't need an `api/` directory or any routing configuration.

    			<Note>
    				`port` and `hostname` only apply when you run the server locally; they don't configure the deployed endpoint. Unix sockets and [HTML imports](/runtime/http/server#html-imports) in `routes` are not supported on Vercel.

    				To serve WebSocket connections, see the [Bun example in Vercel's WebSockets documentation](https://vercel.com/docs/functions/websockets#bun).
    			</Note>
    		</Tab>

    		<Tab title="Bun.serve() under /api">
    			To add a Bun server to a project that also has a frontend, create `api/server.ts` and call `Bun.serve()` once while the module loads. Vercel deploys it as a single Function at `/api/server`. Unlike the framework preset, only requests for `/api/server` reach this server.

    			```ts api/server.ts icon="/icons/typescript.svg"
    			Bun.serve({
    				fetch(request) {
    					const url = new URL(request.url);

    					return Response.json({
    						message: "Hello from Bun on Vercel",
    						pathname: url.pathname,
    					});
    				},
    			});
    			```

    			This setup only needs the `bunVersion` setting from the previous step; it doesn't use the framework preset or require a `bun.lock` file. To send other paths to this server, add route overrides to `vercel.json`. Each override must use the full request path, including the `/api/server` prefix. See [the Vercel Bun runtime documentation](https://vercel.com/docs/functions/runtimes/bun) for details.
    		</Tab>

    		<Tab title="Next.js or another framework">
    			Frameworks that Vercel supports, such as Next.js, Express, Hono, and Nitro, run on Bun once you set `bunVersion`.

    			If you're deploying a **Next.js** project (including ISR), also update the `package.json` scripts so the Next.js CLI runs under Bun:

    			```json package.json icon="file-json"
    			{
    				"scripts": {
    					"dev": "bun --bun next dev", // [!code ++]
    					"build": "bun --bun next build" // [!code ++]
    				}
    			}
    			```

    			<Note>
    				The `--bun` flag runs the Next.js CLI under Bun. Bundling (with Turbopack or Webpack) is unchanged.
    			</Note>
    		</Tab>
    	</Tabs>
    </Step>

    <Step title="Deploy your app">
    	Connect your repository to Vercel, or deploy from the CLI:

    	```bash terminal icon="terminal"
    	# Using bunx (no global install)
    	bunx vercel login
    	bunx vercel deploy
    	```

    	Or install the Vercel CLI globally:

    	```bash terminal icon="terminal"
    	bun i -g vercel
    	vercel login
    	vercel deploy
    	```

    	[Learn more in the Vercel Deploy CLI documentation →](https://vercel.com/docs/cli/deploy)
    </Step>

    <Step title="Verify the runtime">
    	To confirm your deployment uses Bun, log the Bun version:

    	```ts server.ts icon="/icons/typescript.svg"
    	console.log("runtime", process.versions.bun);
    	```
    	```txt
    	runtime 1.3.14
    	```

    	[See the Vercel Bun Runtime documentation for feature support →](https://vercel.com/docs/functions/runtimes/bun#feature-support)
    </Step>

</Steps>

---

- [Fluid compute](https://vercel.com/docs/fluid-compute): Both Bun and Node.js runtimes run on Fluid compute and support the same core Vercel Functions features.
- [Middleware](https://vercel.com/docs/routing-middleware): To run Routing Middleware with Bun, set the runtime to `nodejs`:

```ts middleware.ts icon="/icons/typescript.svg"
export const config = { runtime: "nodejs" }; // [!code ++]
```