Static Hosting

With static hosting, hosting where no server is needed or when not using serverMiddleware, you can choose to either host a single page application or a multiple page application, also known as static sites. With static hosting no server is needed, meaning your SPA or static site can be hosted on any serverless hosting or CDN for free.

SPA

Single page applications are pages that are rendered only on the client side without the need of a server. To deploy without server-side-rendering support (single page only) set ssr to false and then use the build command to build your application.

export default {
  ssr: false
}

Static Sites

As Nuxt.js also works as a static site generator you can therefore generate your application as a static site. Statically render your Nuxt.js application and get all of the benefits of a universal app without a server. The nuxt generate command will generate a completely static version of your website. It will generate HTML for every one of your routes and put it inside of its own file in the dist folder. Basically any file that is placed inside the pages folder will be generated as a static html page. This improves performance as well as SEO and better offline support.

For static sites the target of static needs to be added to your nuxt.config file.

export default {
  target: 'static' // default is 'server'
}

Running nuxt dev with the static target will improve the developer experience:

• Remove req & res from context
• Fallback to client-side rendering on 404, errors and redirects see SPA fallback
• $route.query will always be equal to {} on server-side rendering
• process.static is true

Server Hosting

Server Hosting is hosting that requires a server and is intended for SSR applications or applications that are using serverMiddleware. Server-side rendering otherwise known as SSR means that your page is rendered on the server when it is requested by the user. When the user opens your page in a browser the browser sends a request to the server requesting that page. The page is rendered on the server and sent back to the browser with all its content.

For server hosting the target of server is used, which is the default value. With SSR you use the build command to build your application.

export default {
  target: 'server'
}