Next.js をデプロイする

ロリポップ！デプロイナウで Next.js アプリを公開するときは、フレームワークに next を選びます。

lolipop deploy --name <name> --framework next

対話形式でプロジェクトを作る場合も、フレームワークの選択で next を選びます。 利用できるフレームワーク名は lolipop frameworks list で確認できます。

output: 'standalone' を設定する

Next.js は next.config で output: 'standalone' が必要です。 この設定が無いと、ビルド後に公開に必要な成果物を組み立てられません。

import type { NextConfig } from 'next'
 
const nextConfig: NextConfig = {
  output: 'standalone',
}
 
export default nextConfig

next.config.js を使う場合も、同じ値を設定します。

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'standalone',
}
 
module.exports = nextConfig

.next はアップロードされない

lolipop deploy はアプリのソースをアップロードし、デプロイ側でインストールとビルドを実行します。 ローカルで生成した .next はアップロードされません。

そのため、ローカルの .next にだけ存在するファイルや、ローカルのビルド結果に依存した構成では公開できません。 必要なファイルはソースとして管理し、ビルドコマンドで再生成できる状態にしてください。

ビルド設定を合わせる

フレームワークに next を選ぶと、standalone 出力に必要なビルド設定が既定で入ります。 出力ディレクトリ（--output）は既定で .next/standalone になるため、通常は指定する必要はありません。

インストールコマンドやビルドコマンドを変えたいときだけ、プロジェクト作成時に指定するか、作成後に build-config update で更新します。

lolipop project create --name <name> --framework next --install "pnpm install" --build "pnpm build"
lolipop build-config update --project <id> --build "pnpm build"

モノレポではルートを指定する

Next.js アプリがリポジトリのサブディレクトリにある場合は、ビルドのルートをアプリのディレクトリに合わせます。

lolipop deploy --name <name> --framework next --root apps/web

既存プロジェクトの設定は build-config update で変更できます。

lolipop build-config update --project <id> --root apps/web

環境変数や .env の扱いは環境変数を参照してください。