Production Configuration for NextJS Prisma Deployed on Vercel

BY Connor Bearse / FILED UNDER Development

If you’re hosting your NextJs project on Vercel and want to utilize Prisma, here is the simple setup for production. It’s in the docs (kinda), but I figured I would pull it out and make it easy to identify.

Set Your Production Environment Variables

Be sure you have your .env file set up. If you have a pretty vanilla setup you will only need the following:

DATABASE_URL='url here'

The docs recommend setting up your production variables with Vercel. This is a personal preference. If you go this route here is the location in settings for your Vercel environment variables:

The location of Vercel environment variables

Update Vercel Your Build Step

In package.json, update the build line to have the following:

"build": "prisma generate && prisma migrate deploy && next build",

The scripts section can potentially look like the following. Only line 7 was updated:


If all goes right when deploying to Vercel, you should be good to go.

Prisma Generate will build the Prisma Client, Prisma Migrate will update the database structure and move data, and then next build will get your app built.

More From ClickShepherd...