Next.jsでstandalone buildするときに気をつけること
publication: 2022/11/05
update:2023/06/22
Next.jsのstandalone buildとは
/**
* @type { import("next").NextConfig}
*/
const config = {
output: 'standalone'
}
以上の設定でnext buildを使用すると、.next/standaloneディレクトリが作成され、実行に必要な最小限のファイルがコピーされます。Dockerイメージを作成するような場合、この機能によってイメージサイズをかなり縮小できます。
コピーされないファイル
ただしこちらに書いてある通り.next/staticとpublicはコピーされないため、自分で配置する必要があります。さらにランタイムにexperimental-edgeを選んでいる場合は注意が必要です。.next/standalone/serverで必要なファイルが足りない状態となります。 VercelがCDNに入れるべきと判断したファイルはとことん削られています。
それ以外にもnode_modulesの中の*.wasmもコピーされないので、必要とする場合は注意が必要です。
Dockerファイルのサンプル
FROM node:alpine as build
WORKDIR /app
COPY package.json yarn.lock ./
RUN --mount=type=cache,target=/usr/local/share/.cache/yarn/v6 yarn
COPY . .
RUN yarn build &&\
cp -r -u .next/server .next/standalone/.next &&\
cp -r -u .next/static .next/standalone/.next &&\
cp -r -u public .next/standalone
FROM node:alpine
WORKDIR /app
COPY --from=build /app/.next/standalone ./
EXPOSE 3000
CMD ["node","server.js"]
Next.jsのDockerイメージを作るときは、以上のような設定をしています。package.json内のbuildスクリプト内でコピーするコマンドを入れる方法もあります。
まとめ
.next/standalone/serverのコピーされないファイルに関してはドキュメントに触れられていません。このせいでサーバエラーが出てしまった場合は、必要なファイルをコピーして解決しましょう。