Deploying to Vercel

This guide walks you through deploying a Discord bot built with Dressed to Vercel, either as a standalone project or inside a Next.js app.

Deploying is the last step in building your bot, it will be where Discord can send interactions and events even when you're not developing it.

Standalone Deployment (Vercel Functions)

vercel.json

{
  "buildCommand": "dressed build",
  "outputDirectory": ".dressed"
}

Make sure that the type key is set to "module" in your package.json
package.json
```
{
  "type": "module"
}
```

api / bot.ts

// @ts-ignore Generated after build
import { commands, components, events } from "../.dressed/index.js";
import { handleRequest } from "dressed/server";
 
export const POST = (req: Request) => handleRequest(req, commands, components, events);

Next.js Projects

If you’re using Next.js, you don’t need a vercel.json file. The Next.js framework preset will handle config automatically. Just add an API route:

app / api / bot / route.ts

// @ts-ignore Generated after build
import { commands, components, events } from "../../../.dressed";
import { handleRequest } from "dressed/server";
 
export const POST = (req: Request) => handleRequest(req, commands, components, events);

Important

Make sure your build script bundles your bot files before your Next.js project, like so:

package.json

{
  "scripts": {
    "build": "dressed build && next build"
  }
}

Environment variables

If you are creating a new project, you will need to upload your environment variables to be used by the bot. Vercel documentation.

Upload

You now can upload it to Vercel however you like, either through linking to GitHub, or using the CLI:

bunx vercel --prod

Your bot should now be accessible at <project>.vercel.app/api/bot.