Next.js CLI

Next.js CLI を使用するとアプリケーションの起動、ビルド、エクスポートが可能です。

利用可能なCLIコマンドの一覧を表示するには、プロジェクトディレクトリ内で次のコマンドを実行します：

npx next -h

(npx はnpm 5.2以降に同梱されています)

出力は次のようになります：

使用方法
  $ next <コマンド>

利用可能なコマンド
  build, start, export, dev, lint, telemetry, info

オプション
  --version, -v   バージョン番号
  --help, -h      このヘルプメッセージを表示

詳細情報を表示するにはコマンドに--helpフラグを付けて実行
  $ next build --help

next コマンドには任意の Node引数 を渡せます：

NODE_OPTIONS='--throw-deprecation' next
NODE_OPTIONS='-r esm' next
NODE_OPTIONS='--inspect' next

豆知識: next をコマンドなしで実行すると next dev を実行した場合と同じになります

ビルド

next build はアプリケーションの最適化されたプロダクションビルドを作成します。出力には各ルートに関する情報が表示されます。

• サイズ - クライアントサイドでページにナビゲートする際にダウンロードされるアセットのサイズ。各ルートのサイズには依存関係のみが含まれます。
• 初回ロードJS - サーバーからページを訪問した際にダウンロードされるアセットのサイズ。全ページで共有されるJSの量は別の指標として表示されます。

これらの値はどちらも gzip圧縮されたサイズ です。初回ロードは緑、黄、赤で表示されます。パフォーマンスの高いアプリケーションでは緑を目指しましょう。

next build で --profile フラグを使用すると、Reactのプロダクションプロファイリングを有効にできます。これは Next.js 9.5 以降が必要です：

next build --profile

これにより、開発時と同じ方法でプロファイラーを使用できます。

next build で --debug フラグを使用すると、より詳細なビルド出力を有効にできます。これはNext.js 9.5.3以降が必要です：

next build --debug

このフラグを有効にすると、リライト、リダイレクト、ヘッダーなどの追加のビルド出力が表示されます。

開発

next dev はホットコードリロード、エラー報告などを備えた開発モードでアプリケーションを起動します：

アプリケーションはデフォルトで http://localhost:3000 で起動します。デフォルトポートは -p で変更できます：

npx next dev -p 4000

または PORT 環境変数を使用します：

PORT=4000 npx next dev

豆知識: HTTPサーバーの起動は他のコードが初期化される前に行われるため、.env で PORT を設定できません。

デフォルトの 0.0.0.0 とは異なるホスト名を設定することも可能です。これはネットワーク上の他のデバイスからアプリケーションを利用可能にする場合に便利です。デフォルトホスト名は -H で変更できます：

npx next dev -H 192.168.1.2

プロダクション

next start はプロダクションモードでアプリケーションを起動します。まず next build でアプリケーションをコンパイルする必要があります。

アプリケーションはデフォルトで http://localhost:3000 で起動します。デフォルトポートは -p で変更できます：

npx next start -p 4000

または PORT 環境変数を使用します：

PORT=4000 npx next start

豆知識:

• HTTPサーバーの起動は他のコードが初期化される前に行われるため、.env で PORT を設定できません。

• next start は output: 'standalone' または output: 'export' と一緒に使用できません。

キープアライブタイムアウト

Next.jsを下流プロキシ（例：AWS ELB/ALBなどのロードバランサー）の背後にデプロイする場合、Nextの基盤となるHTTPサーバーを、下流プロキシのタイムアウトよりも長いキープアライブタイムアウトで設定することが重要です。そうしないと、特定のTCP接続のキープアライブタイムアウトに達すると、Node.jsは下流プロキシに通知せずにその接続を即座に終了します。これにより、Node.jsがすでに終了した接続を再利用しようとするたびにプロキシエラーが発生します。

本番Next.jsサーバーのタイムアウト値を設定するには、next start に --keepAliveTimeout（ミリ秒単位）を渡します：

npx next start --keepAliveTimeout 70000

リンター

next lint は pages/、app/、components/、lib/、src/ ディレクトリ内のすべてのファイルに対してESLintを実行します。また、 アプリケーションでESLintがまだ設定されていない場合、必要な依存関係をインストールするためのガイド付きセットアップも提供します。

リンターを実行したい他のディレクトリがある場合は、--dir フラグを使用して指定できます：

next lint --dir utils

テレメトリ

Next.jsは完全に匿名の一般的な使用状況に関するテレメトリデータを収集します。 この匿名プログラムへの参加は任意であり、情報を共有したくない場合はオプトアウトできます。

テレメトリについて詳しくは、こちらのドキュメントをお読みください。

Next情報

next info はNext.jsのバグを報告する際に使用できる、現在のシステムに関する関連情報を出力します。 この情報には、オペレーティングシステムのプラットフォーム/アーキテクチャ/バージョン、バイナリ（Node.js、npm、Yarn、pnpm）、およびnpmパッケージバージョン（next、react、react-dom）が含まれます。

プロジェクトのルートディレクトリで次のコマンドを実行します：

next info

次のような情報が得られます：

オペレーティングシステム:
  プラットフォーム: linux
  アーキテクチャ: x64
  バージョン: #22-Ubuntu SMP Fri Nov 5 13:21:36 UTC 2021
バイナリ:
  Node: 16.13.0
  npm: 8.1.0
  Yarn: 1.22.17
  pnpm: 6.24.2
関連パッケージ:
  next: 12.0.8
  react: 17.0.2
  react-dom: 17.0.2

この情報はGitHub Issuesに貼り付けてください。

インストールの問題を診断するには、next info --verbose を実行して、システムとnext関連パッケージのインストールに関する追加情報を出力できます。