Next.js の static export をデプロイする

Next.js の static export は、HTML、JavaScript、アセットを out/ に生成します。nginx Dockerfile を使って、そのディレクトリを Lizard にデプロイします。事前にビルドできるページではこの方法を使い、リクエスト時のサーバー機能については Node.js server ガイドを使ってください。

export を設定する

これらのオプションを next.config.mjs にマージします:

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'export',
  trailingSlash: true,
  images: { unoptimized: true },
};
 
export default nextConfig;

"build": "next build" は package.json のままにしてください。この例では通常の export された画像を使います。外部の画像ローダーも別の選択肢です。必要な動的ルートパラメーターはすべてビルド中に生成してください。リクエスト時の cookies、Server Actions、および実行中の Next.js サーバーを必要とするその他の機能は、この static コンテナでは実行できません。アプリで使っている機能については、Next.js静的エクスポートリファレンスを確認してください。

完全な Dockerfile を追加する

Next.js の自動検出パスは Node サーバーを前提としています。設定で out/ を export していても、自動的に nginx へ切り替わることはありません。この Dockerfile をアプリのルートに追加してください。npm と、コミット済みの package-lock.json を前提としています:

FROM node:22-slim AS build
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm ci
COPY . .
RUN npm run build
 
FROM nginx:alpine
COPY --from=build /app/out /usr/share/nginx/html
COPY nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80

その横に nginx.conf を作成します:

server {
  listen 80;
  server_name _;
  root /usr/share/nginx/html;
  index index.html;
  location / {
    try_files $uri $uri/ =404;
  }
  error_page 404 /404.html;
  location = /404.html {
    internal;
  }
}

末尾スラッシュ付きの export では、index.html を持つルートディレクトリが作成されます。nginx ルールはそれらのディレクトリを配信し、存在しないパスには HTTP 404 を返します。node_modules、.next、out、.git、.env* を .dockerignore に追加し、ローカルのビルドファイルがアップロードに含まれないようにしてください。

ビルドしてデプロイする

npm ci
npm run build

out/index.html と、想定どおりの内部ルートが存在することを確認してください。Docker が利用できる場合は、実際のサーバーをローカルでテストします:

docker build -t nextjs-static .
docker run --rm -p 8080:80 nextjs-static

CLI セットアップの後、新しいサービスにデプロイします:

lizard init --name nextjs-static
lizard add --service web
lizard up --service web --port 80
lizard logs --build --service web --json
lizard ps --json

完全な Dockerfile には、lizardpack が認識できる npm build ステップが含まれています。既存のサービスでは、Dockerfile を選択する前に、競合する build/start オーバーライドを確認してクリアしてください。詳細はビルドの決定順序を参照してください。

ルートと更新を確認する

公開中のホームページ、export された内部ルート、JavaScript アセット、そして存在しない適当なパスをリクエストしてください。存在しないパスは、HTTP 200 のホームページではなく、HTTP 404 を返す必要があります。静的ルートと404エラーの確認手順を使ってください。

export されたコンテンツの変更はすべて、新しいビルドが必要です。ランタイム環境変数では、out/ にすでに書き込まれた値は変更できません。カスタム Dockerfile で公開用の build 変数を使う場合は、必要な ARG を RUN npm run build の前に宣言してください。秘密の認証情報を export 済みバンドルに入れないでください。

2026年9月9日のデプロイ確認とその制限については、テスト済みバージョンとクラウド結果を参照してください。

Next.js Vue (Vite)