Nuxtアプリケーションは、Node.jsサーバー上にデプロイすることも、静的ホスティング用に事前にレンダリングすることも、サーバーレスまたはエッジ（CDN）環境にデプロイすることもできます。

Node.jsサーバー

NitroのNode.jsサーバープリセットを使用して、任意のNodeホスティングにデプロイします。

• デフォルトの出力フォーマット 自動検出または指定がない場合
  
• 最適なクールスタートタイミングのために、リクエストのレンダリングに必要なチャンクのみをロード
  
• 任意のNode.jsホスティングにNuxtアプリをデプロイするのに便利

エントリーポイント

Nodeサーバープリセットで nuxt build を実行すると、すぐに実行可能なNodeサーバーを起動するエントリーポイントが生成されます。

node .output/server/index.mjs

これにより、デフォルトではポート3000でリスニングする本番Nuxtサーバーが起動します。

以下のランタイム環境変数を尊重します：

• NITRO_PORT または PORT（デフォルトは 3000）
• NITRO_HOST または HOST（デフォルトは '0.0.0.0'）
• NITRO_SSL_CERT と NITRO_SSL_KEY - 両方が存在する場合、HTTPSモードでサーバーが起動します。ほとんどの場合、これはテスト以外では使用されるべきではなく、NitroサーバーはSSLを終了するnginxやCloudflareのようなリバースプロキシの後ろで実行されるべきです。

PM2

PM2（プロセスマネージャー2）は、サーバーまたはVM上のNuxtアプリケーションをホスティングするための迅速かつ簡単なソリューションです。

pm2 を使用するには、ecosystem.config.cjsを使用します：

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

クラスターモード

NITRO_PRESET=node_cluster を使用することで、Node.jsのクラスターモジュールを利用してマルチプロセスのパフォーマンスを活用できます。

デフォルトでは、ワークロードはラウンドロビン戦略を使用してワーカーに分散されます。

もっと学ぶ

静的ホスティング

Nuxtアプリケーションを任意の静的ホスティングサービスにデプロイする方法は2つあります：

• 静的サイト生成（SSG）は ssr: true を使用し、ビルド時にアプリケーションのルートを事前にレンダリングします。（この動作は、nuxt generate実行時のデフォルト動作です。）また、動的ルートや404エラーをクライアントでレンダリングできるシングルページアプリのフォールバックページである /200.html と /404.html も生成します（ただし、静的ホスト上でこれを設定する必要があるかもしれません）。
• または、ssr: false (静的シングルページアプリ)でサイトをプリレンダリングすることもできます。これにより、Vueアプリが通常レンダリングされる場所に空の <div id="__nuxt"></div> を持つHTMLページが生成されます。サイトのプリレンダリングの多くのSEOメリットを失いますので、<ClientOnly> を使用して、サーバーレンダリングできない部分をラップすることをお勧めします（ある場合）。

クライアント側のみのレンダリング

ルートをプリレンダリングしたくない場合、別の方法として、nuxt.configファイルの ssr プロパティを falseに設定することで静的ホスティングを使用できます。その後、nuxt generateコマンドは典型的なクライアントサイドVue.jsアプリケーションのように、.output/public/index.html エントリーポイントとJavaScriptバンドルを出力します。

export default defineNuxtConfig({
  ssr: false
})

ホスティングプロバイダ

Nuxtは、最小限の設定で複数のクラウドプロバイダーにデプロイできます：

プリセット

Node.jsサーバーや静的ホスティングサービスに加えて、Nuxtプロジェクトは、複数のよくテストされたプリセットと最小限の設定でデプロイされることができます。

nuxt.config.ts ファイルで希望のプリセットを明示的に設定できます：

export default defineNuxtConfig({
  nitro: {
    preset: 'node-server'
  }
})

...または nuxt build実行時に NITRO_PRESET 環境変数を使用します：

NITRO_PRESET=node-server nuxt build

🔎 Nitroデプロイメントで可能なすべてのデプロイプリセットとプロバイダーを確認してください。

CDNプロキシ

ほとんどの場合、NuxtはNuxt自身によって生成または作成されなかったサードパーティのコンテンツと連携できます。しかし、時々そのようなコンテンツが問題を引き起こすことがあります、特にCloudflareの「Minification and Security Options」。

したがって、次のオプションはチェックが外されている/無効になっていることを確認してください。さもないと、不要な再レンダリングまたはハイドレーションエラーが本番アプリケーションに影響を与える可能性があります。

1. Speed > Optimization > Content Optimization > Disable "Rocket Loader™"
2. Speed > Optimization > Image Optimization > Disable "Mirage"
3. Scrape Shield > Disable "Email Address Obfuscation"

これらの設定を行うことで、CloudflareがNuxtアプリケーションに望ましくない副作用を引き起こす可能性のあるスクリプトを挿入することがないことを確認できます。