はじめに
Next.js を使った開発の中で、ESLintエラーによるビルド失敗や、静的ファイル出力までの一連の作業を行いました。
個人の備忘録程度の走り書きとなっておりますが、温かい目で見守っていただければ幸いです。
ここでは、忘れがちなコマンド履歴を備忘録としてまとめておきます。
書こうと思ったきっかけ
Next.js 15系のビルドにおいて、環境変数 NEXTJS_IGNORE_ESLINT=true
が効かず、ESLintのエラーでビルドが止まるという現象に直面。
その後、コードを修正してビルドを成功させたため、今後のためにも一連の作業履歴をまとめておこうと思いました。
実行したコマンド一覧
# 1. 必要なパッケージをインストール
npm install
# 2. Next.js アプリのビルドを試みる(最初は ESLint エラーで失敗)
npm run build
# 3. 該当のコードファイルを編集(不要な import を削除など)
vi src/app/page.tsx
# 4. 再度ビルドを実行(成功)
npm run build
# 5. カレントディレクトリのファイルを確認
ll
生成された out/
ディレクトリに静的ファイルが格納され、静的エクスポートが完了しました。
(今後必要に応じて)
# 静的ファイルをS3へアップロードする例
aws s3 sync ./out s3://your-bucket-name
参考記事
まとめ
-
NEXTJS_IGNORE_ESLINT=true
は Next.js 15系では効かない可能性があるため、ESLintエラーは素直にコード修正で対応するのが最速。 -
vi
などで対象ファイルの不要な import を削除するだけでもビルド成功するケースがある。 - 今後は
out/
ディレクトリを S3 などにアップロードしてホスティングする流れへ進む。
本記録は、自分自身の備忘録としての意味合いも兼ねていますので、ご了承ください...!