nuxt-vercel-builder

Static site with Vercel

If you would like to deploy a static site on Vercel, no configuration is necessary. Vercel will detect that you are using Nuxt and will enable the correct settings for your deployment. For more information, see this Vercel guide.

SSR with Vercel

To deploy a serverless Nuxt runtime with Vercel, the Nuxt.js team and contributors have produced an official @nuxtjs/vercel-builder package.

All you have to do is to setup a vercel.json file:

  1. {
  2.   "builds": [
  3.     {
  4.       "src": "nuxt.config.js",
  5.       "use": "@nuxtjs/vercel-builder",
  6.       "config": {}
  7.     }
  8.   ]
  9. }

Check out the documentation for more information.

Service Worker with Nuxt PWA Module

To avoid 404 for Service Workers, make sure to include sw to your routes settings.

  1. {
  2.   "version": 2,
  3.   "builds": [
  4.     {
  5.       "src": "nuxt.config.js",
  6.       "use": "@nuxtjs/vercel-builder",
  7.       "config": {
  8.         "serverFiles": ["package.json"]
  9.       }
  10.     }
  11.   ],
  12.   "routes": [
  13.     { "src": "/_nuxt/.+", "headers": { "Cache-Control": "max-age=31557600" } },
  14.     {
  15.       "src": "/sw.js",
  16.       "dest": "/_nuxt/static/sw.js",
  17.       "headers": {
  18.         "cache-control": "public, max-age=43200, immutable",
  19.         "Service-Worker-Allowed": "/"
  20.       }
  21.     },
  22.     { "src": "/(.*)", "dest": "/" }
  23.   ]
  24. }

You can learn more and see examples on https://github.com/nuxt/vercel-builder