Vercel

Gitを使ったデプロイ

1. コードをGitリポジトリ（GitHub、GitLab、Bitbucket）にプッシュします。
2. プロジェクトをインポートしてVercelに配置します。
3. VercelはNitroを使用していることを検出し、デプロイメントに必要な設定を有効にします。
4. アプリケーションのデプロイが完了しました！

プロジェクトのインポートとデプロイ後、ブランチへの以降のプッシュはプレビューデプロイメントを生成し、Productionブランチ（通常は「main」）へのすべての変更は本番デプロイメントになります。

VercelのGit連携について、詳細をご覧ください。

Vercel Edge Functions

NuxtアプリケーションをVercel Edge Functionsに直接デプロイできます。

Vercel Edge Functionsを使用すると、サイトの訪問者に対して高速でパーソナライズされたコンテンツを提供できます。デフォルトでVercelのEdgeネットワーク上にグローバルにデプロイされ、サーバーサイドロジックをEdge（訪問者の発信元に近い場所）に移動できます。Edge Functionsは、Chromeブラウザで使用されているのと同じ高性能なV8 JavaScriptとWebAssemblyエンジンを基盤とするVercel Edge Runtimeを使用します。この小さなランタイムを活用することで、Edge FunctionsはServerless Functionsよりも高速なコールドブートと高いスケーラビリティを実現できます。Edge Functionsはキャッシュの後で実行され、応答をキャッシュして返すことができます。詳細はこちら

このターゲットを有効にするには、次の環境変数を設定します。

SERVER_PRESET=vercel_edge

または、ビルドコマンドをnuxt build --preset=vercel_edgeに更新します。

Vercel KV Storage

Vercel KV StorageをNuxt Server Storageで使用できます。

1. @vercel/kv依存関係をインストールします
   ターミナル

   npm i @vercel/kv
   

2. nuxt.configを更新します
   nuxt.config.ts

   export default defineNuxtConfig({
     nitro: {
       storage: {
         data: {
           driver: 'vercelKV'
           /* Vercel KV driver options */
         }
       }
     }
   })
   

これで、server/ディレクトリのどこからでもデータストアにアクセスできます。

export default defineEventHandler(async (event) => {
  const dataStorage = useStorage('data');
  await dataStorage.setItem('hello', 'world');

  return {
    hello: await dataStorage.getItem("hello"),
  }
})

カスタムビルド出力設定

nuxt.config内のnitro.vercel.configキーを使用して、追加のビルド出力設定を提供できます。これは、組み込みの自動生成された設定とマージされます。

テンプレート

詳細情報