Skip to content
This repository has been archived by the owner on Apr 6, 2023. It is now read-only.

docs: merge deployment pages in getting started #7765

Merged
merged 17 commits into from Sep 30, 2022
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
141 changes: 141 additions & 0 deletions docs/content/1.getting-started/10.deployment.md
@@ -0,0 +1,141 @@
# Deployment

A Nuxt application can be deployed on a Node or Deno server, pre-rendered to be hosted in static environments, or deployed to serverless and edge providers.
Atinux marked this conversation as resolved.
Show resolved Hide resolved
pi0 marked this conversation as resolved.
Show resolved Hide resolved

## Node.js Server

Discover the Node.js server preset with Nitro to deploy on any Node hosting.

::list

- **Default output format** if none is specified or auto-detected <br>
- Loads only the required chunks to render the request for optimal cold start timing <br>
- Useful for deploying Nuxt apps to any Node.js hosting
::

### Entry Point

When running `nuxt build` with the Node server preset, the result will be an entry point that launches a ready-to-run Node server.

```bash
node .output/server/index.mjs
```

### Example

```bash
$ node .output/server/index.mjs
Listening on http://localhost:3000
```

### Configuring Defaults at Runtime

This preset will respect the following runtime environment variables:

- `NITRO_PORT` or `PORT` (defaults to `3000`)
- `NITRO_HOST` or `HOST` (defaults to `'0.0.0.0'`)
- `NITRO_SSL_CERT` and `NITRO_SSL_KEY` - if both are present, this will launch the server in HTTPS mode. In the vast majority of cases, this should not be used other than for testing, and the Nitro server should be run behind a reverse proxy like nginx or Cloudflare which terminates SSL.

#### Using PM2

To use `pm2`, use an `ecosystem.config.js`:

```js [ecosystem.config.js]
module.exports = {
apps: [
{
name: 'NuxtAppName',
exec_mode: 'cluster',
instances: 'max',
script: './.output/server/index.mjs'
}
]
}
```

#### Using Cluster Mode

You can use `NITRO_PRESET=node_cluster` in order to leverage multi-process performance using Node.js [cluster](https://nodejs.org/dist/latest/docs/api/cluster.html) module.

By default, the workload gets distributed to the workers with the round robin strategy.

### Learn More

:ReadMore{link="https://nitro.unjs.io/deploy/node" title="the Nitro documentation for node-server preset"}

## Static Hosting

There are two ways to deploy a Nuxt application to any static hosting services:

- Static site generation (SSG) prerenders every route of your application at build time. For every page, Nuxt uses a crawler to generate a corresponding HTML and payload files.
- Using `ssr: false` to produce a pure client-side output.

### Prerendering
clemcode marked this conversation as resolved.
Show resolved Hide resolved

Use the [`nuxi generate` command](/api/commands/generate) to build your application. The HTML files will be generated in the `.output/public` directory.

```bash
npx nuxi generate
```

### Client-side Only Rendering

If you don't want to prerender your routes, another way of using static hosting is to set the `ssr` property to `false` in the `nuxt.config` file. The `nuxi generate` command will then output an `index.html` entrypoint like a classic client-side Vue.js application.
clemcode marked this conversation as resolved.
Show resolved Hide resolved
Atinux marked this conversation as resolved.
Show resolved Hide resolved

```ts [nuxt.config.ts|js]
defineNuxtConfig({
ssr: false
})
```

### Advanced

You can manually specify routes that [Nitro](/guide/concepts/server-engine) will fetch and prerender during the build.
clemcode marked this conversation as resolved.
Show resolved Hide resolved
Atinux marked this conversation as resolved.
Show resolved Hide resolved

```ts [nuxt.config.ts|js]
defineNuxtConfig({
nitro: {
prerender: {
routes: ['/user/1', '/user/2']
}
}
})
```

## Presets

In addition to Node.js servers and static hosting services, a Nuxt 3 project can be deployed with several well-tested presets and minimal amount of configuration.

You can use the [Nuxt config](/guide/directory-structure/nuxt.config) to explicitly set the preset to use:
clemcode marked this conversation as resolved.
Show resolved Hide resolved

```js [nuxt.config.js|ts]
export default {
nitro: {
preset: 'node-server'
}
}
```

Or directly use the `NITRO_PRESET` environment variable when running `nuxt build`:
clemcode marked this conversation as resolved.
Show resolved Hide resolved

```bash
NITRO_PRESET=node-server nuxt build
```

๐Ÿ”Ž Check [the Nitro deployment](https://nitro.unjs.io/deploy) for all possible deployment presets and providers.

### Supported Hosting Providers

Nuxt 3 can be deployed to several cloud providers with a minimal amount of configuration:

- :IconCloud{class="h-5 w-4 inline mb-2"} [AWS](https://nitro.unjs.io/deploy/providers/aws)
- :LogoAzure{class="h-5 w-4 inline mb-2"} [Azure](https://nitro.unjs.io/deploy/providers/azure)
- :LogoCloudFlare{class="h-5 w-4 inline mb-2"} [CloudFlare](https://nitro.unjs.io/deploy/providers/cloudflare)
- :IconCloud{class="h-5 w-4 inline mb-2"} [Digital Ocean](https://nitro.unjs.io/deploy/providers/digitalocean)
- :LogoFirebase{class="h-5 w-4 inline mb-2"} [Firebase](https://nitro.unjs.io/deploy/providers/firebase)
- :IconCloud{class="h-5 w-4 inline mb-2"} [heroku](https://nitro.unjs.io/deploy/providers/heroku)
- :IconCloud{class="h-5 w-4 inline mb-2"} [layer0](https://nitro.unjs.io/deploy/providers/layer0)
- :LogoNetlify{class="h-5 w-4 inline mb-2"} [Netlify](https://nitro.unjs.io/deploy/providers/netlify)
- :IconCloud{class="h-5 w-4 inline mb-2"} [Render](https://nitro.unjs.io/deploy/providers/render)
- :IconCloud{class="h-5 w-4 inline mb-2"} [Stormkit](https://nitro.unjs.io/deploy/providers/stormkit)
- :LogoVercel{class="h-5 w-4 inline mb-2"} [Vercel](https://nitro.unjs.io/deploy/providers/vercel)
60 changes: 0 additions & 60 deletions docs/content/2.guide/3.deploy/1.node-server.md

This file was deleted.

38 changes: 0 additions & 38 deletions docs/content/2.guide/3.deploy/2.static-hosting.md

This file was deleted.

37 changes: 0 additions & 37 deletions docs/content/2.guide/3.deploy/3.presets.md

This file was deleted.

7 changes: 0 additions & 7 deletions docs/content/2.guide/3.deploy/index.md

This file was deleted.

11 changes: 0 additions & 11 deletions docs/content/2.guide/3.deploy/providers/aws.md

This file was deleted.

18 changes: 0 additions & 18 deletions docs/content/2.guide/3.deploy/providers/azure.md

This file was deleted.

18 changes: 0 additions & 18 deletions docs/content/2.guide/3.deploy/providers/cloudflare.md

This file was deleted.

11 changes: 0 additions & 11 deletions docs/content/2.guide/3.deploy/providers/digitalocean.md

This file was deleted.

15 changes: 0 additions & 15 deletions docs/content/2.guide/3.deploy/providers/firebase.md

This file was deleted.

11 changes: 0 additions & 11 deletions docs/content/2.guide/3.deploy/providers/heroku.md

This file was deleted.

3 changes: 0 additions & 3 deletions docs/content/2.guide/3.deploy/providers/index.md

This file was deleted.

13 changes: 0 additions & 13 deletions docs/content/2.guide/3.deploy/providers/layer0.md

This file was deleted.