How To Deploy a Nuxt App on Vercel From Github

Today, I will show you the easiest way to get your Nuxt application online. Vercel is an open serverless platform that will allow you to host your Nuxt app for free. There are paid plans but for this tutorial, I’m going to show you how to set up your application from your Github repo in as little time as possible.

Let’s begin.

Setup

You may get an error during the deployment phase showing that there is a missing public or ./dist . This issue can be solved quite easily by using nuxt generate in the build script. Nuxt generate will create the directories needed for Vercel.

"build": "nuxt generate --output public",

Login to Vercel

If you don’t have an account, you can create a free one by visiting their website. After doing so, login into your account to access the dashboard. You should see something like this.

Next what you will want to do is create a new project by clicking the black button by the search bar.

Importing the Git Repo

I will be using a recent app I am building as a demonstration of how this will work. Find the repo that you’d like to use and click the import button.

Creating a team is optional and you get a free trial but we will skip this step for now.

Configuration is where we will add our options and environmental variables for the app. If you don't have any, you are free to go with the default settings. If you do, simply copy the key and the variable name into environment variables settings as shown below.