DEV Community

Cover image for Deploying Nuxt 3 app to Vercel πŸš€

Deploying Nuxt 3 app to Vercel πŸš€

Jakub Andrzejewski on September 05, 2022

When I started developing websites some time ago, there was no good free hosting providers. The only options available back then were the hostings ...
Collapse
 
bongudth profile image
Huynh Thi Khanh Linh

i tried changing OUTPUT DIRECTORY into .vercel/output/static instead .output/public and then success

Image description

Collapse
 
toniengelhardt profile image
Toni Engelhardt

Doesn't seem to work for me with Nuxt 3.0.0-rc.13-27772354.a0a59e2 and ssr: false. Am I missing something?

Error: No Output Directory named "public" found after the Build completed. You can configure the Output Directory in your Project Settings.
Enter fullscreen mode Exit fullscreen mode
Collapse
 
jacobandrewsky profile image
Jakub Andrzejewski

Hey, you are using an edge version of the release candidate that wasn't yet released (current stable one is -rc.12) so I would guess that this can be the issue.

Collapse
 
toniengelhardt profile image
Toni Engelhardt

Ok, will wait for -rc.13. It's just strange bc if I build locally the .output/public folder is there.

Collapse
 
igortrindade profile image
Igor Trindade

I just deployed a project using Nuxt3 and Vercel and it works with the config:

'build command' to nuxt generate the 'output directory' to the default *dist *...

Collapse
 
toniengelhardt profile image
Toni Engelhardt

What do you mean with default dist?

Thread Thread
 
igortrindade profile image
Igor Trindade

When we deploy a project to vercel, it scan's the project structure and try to offer some template settings based on the project, so the default "output directory" that Vercel's offer for a Nuxt project is the "dist" and it works well for static site generate as so for SSR...

Image description

Thread Thread
 
toniengelhardt profile image
Toni Engelhardt

Thanks a lot, will give it another try πŸ™πŸ½

Thread Thread
 
toniengelhardt profile image
Toni Engelhardt

Not sure if that is working correctly. Getting way worse pagespeed performance with this setting compared to SSR...

Image description

Thread Thread
 
jacobandrewsky profile image
Jakub Andrzejewski

Maybe you can then try the routeRoules? Thanks to them you can decide what routes should be generated statically and what should be generated on SSR.

Thread Thread
 
toniengelhardt profile image
Toni Engelhardt

That app only has one page... Theoretically the static generation should have perfect speed scores no?

Thread Thread
 
jacobandrewsky profile image
Jakub Andrzejewski

Yes, theoretically. For single page it should be faster that way but maybe there document itself is really big and heavy to process by the browser while it is easier to process on the server side. Just guessing.

Thread Thread
 
toniengelhardt profile image
Toni Engelhardt

Probably, it's this page: webapicheck.com

Collapse
 
leerob profile image
Lee Robinson

Hey there! Good news, Nuxt on Vercel is now fully zero-configuration, including Nuxt 3: vercel.com/docs/frameworks/nuxt

Collapse
 
jacobandrewsky profile image
Jakub Andrzejewski

Hey Lee!

Thanks for letting me know! This article is now a bit outdated.

I will check out the link you mention and create an updated article for it! :)

Collapse
 
kissu profile image
Konstantin BIFERT

Simple, clean and efficient. πŸ‘ŒπŸ»