When I started developing websites some time ago, there was no good free hosting providers. The only options available back then were the hostings that included several ads and promotions that were basically causing your website to not be viewable at all.

Thankfully, nowadays deploying web applications to free hosting is much better and you can choose from a variety of providers like Vercel, Netlify, Heroku, and many more!

In this article, I would like to guide you through the process of deploying your Nuxt 3 application to Vercel.

Code

First things first, we would need a Nuxt 3 application that will be then pushed to the Github repository. I suppose you already have it as you are reading this article and you are only interested in the instructions on how to deploy it to Vercel. Also, in this article I will show how to deploy the static website (SSG).

If you are interested in the process of building a simple web application clone that could be then deployed to Vercel, I highly recommend you to check out the following video:

The first thing we need to do is to import GitHub repository in Vercel

Later, let's define proper build command:

Build command should be yarn generate and output folder .output/public

If you like, below you can add some environment variables (i.e. access tokens)

If all went well with the configuration, you should see similar result as our demo https://nuxt-modules-clone.vercel.app/

Summary

Nicely done! You have just deployed a static Nuxt 3 application to Vercel hosting!