Next CLI
Next.js CLIを使用すると、アプリケーションの開発、ビルド、起動などを実行できます。
基本的な使用方法
npx next [command] [options]リファレンス
次のオプションを使用できます。
| オプション | 説明 |
|---|---|
-h または --help | 使用可能なすべてのオプションを表示します。 |
-v または --version | Next.jsのバージョン番号を出力します。 |
コマンド
次のコマンドを使用できます。
| コマンド | 説明 |
|---|---|
dev | ホットモジュールリローディング、エラーレポートなどを使用して、開発モードでNext.jsを起動します。 |
build | アプリケーションの最適化された本番ビルドを作成します。各ルートに関する情報を表示します。 |
start | 本番モードでNext.jsを起動します。アプリケーションは最初に`next build`でコンパイルする必要があります。 |
info | Next.jsのバグを報告するために使用できる、現在のシステムに関する関連情報を表示します。 |
lint | /src、/app、/pages、/components、および/libディレクトリのすべてのファイルに対してESLintを実行します。ESLintがアプリケーションにまだ設定されていない場合は、必要な依存関係をインストールするためのガイド付きセットアップも提供します。 |
telemetry | 完全に匿名のNext.jsテレメトリ収集を有効または無効にできます。 |
重要: コマンドなしで`next`を実行すると、`next dev`のエイリアスになります。
next dev オプション
next devは、ホットモジュールリローディング（HMR）、エラーレポートなどで開発モードでアプリケーションを起動します。next devを実行する際には、次のオプションを使用できます。
| オプション | 説明 |
|---|---|
-h, --help | 使用可能なすべてのオプションを表示します。 |
[ディレクトリ] | アプリケーションをビルドするディレクトリ。指定しない場合は、現在のディレクトリが使用されます。 |
--turbo | Turbopackを使用して開発モードを起動します。 |
-p または --port <ポート> | アプリケーションを起動するポート番号を指定します。デフォルト: 3000、環境変数: PORT |
-H または --hostname <ホスト名> | アプリケーションを起動するホスト名を指定します。ネットワーク上の他のデバイスからアプリケーションを利用可能にするために役立ちます。デフォルト: 0.0.0.0 |
--experimental-https | HTTPSでサーバーを起動し、自己署名証明書を生成します。 |
--experimental-https-key <パス> | HTTPSキーファイルへのパス。 |
--experimental-https-cert <パス> | HTTPS証明書ファイルへのパス。 |
--experimental-https-ca <パス> | HTTPS認証局ファイルへのパス。 |
--experimental-upload-trace <traceUrl> | デバッグトレースのサブセットをリモートHTTP URLに報告します。 |
next build オプション
next buildは、アプリケーションの最適化された本番ビルドを作成します。出力は各ルートに関する情報を表示します。例:
Route (app) Size First Load JS
┌ ○ /_not-found 0 B 0 kB
└ ƒ /products/[id] 0 B 0 kB
○ (Static) prerendered as static content
ƒ (Dynamic) server-rendered on demand- サイズ: クライアント側でページに移動したときにダウンロードされるアセットのサイズ。各ルートのサイズは、その依存関係のみを含みます。
- 初回読み込みJS: サーバーからページにアクセスしたときにダウンロードされるアセットのサイズ。すべてで共有されるJSの量は、個別の指標として表示されます。
これらの値はどちらもgzipで圧縮されています。初回読み込みは、緑、黄、赤で示されます。パフォーマンスの高いアプリケーションを目指して緑にすることを目指してください。
next buildコマンドには、次のオプションを使用できます。
| オプション | 説明 |
|---|---|
-h, --help | 使用可能なすべてのオプションを表示します。 |
[ディレクトリ] | アプリケーションをビルドするディレクトリ。指定しない場合は、現在のディレクトリが使用されます。 |
-d または --debug | より詳細なビルド出力を有効にします。このフラグを有効にすると、書き換え、リダイレクト、ヘッダーなどの追加のビルド出力が表示されます。 |
--profile | 本番環境のReact プロファイリング を有効にします。 |
--no-lint | リンティングを無効にします。 |
--no-mangling | 名前マングリング を無効にします。これによりパフォーマンスに影響する可能性があり、デバッグ目的でのみ使用してください。 |
--experimental-app-only | App Routerルートのみをビルドします。 |
--experimental-build-mode [mode] | 実験的なビルドモードを使用します。(選択肢: "compile", "generate", デフォルト: "default") |
next start オプション
next start はアプリケーションを本番モードで起動します。アプリケーションは事前に next build でコンパイルする必要があります。
next start コマンドで使用できるオプションは以下のとおりです。
| オプション | 説明 |
|---|---|
-h または --help | 使用可能なすべてのオプションを表示します。 |
[ディレクトリ] | アプリケーションを起動するディレクトリ。ディレクトリを指定しない場合は、現在のディレクトリが使用されます。 |
-p または --port <ポート> | アプリケーションを起動するポート番号を指定します。(デフォルト: 3000, 環境変数: PORT) |
-H または --hostname <hostname> | アプリケーションを起動するホスト名を指定します (デフォルト: 0.0.0.0)。 |
--keepAliveTimeout <keepAliveTimeout> | 非アクティブな接続を閉じるまでの最大待機時間（ミリ秒）を指定します。 |
next info オプション
next info は、GitHub issue を開く際にNext.jsのバグを報告するために使用できる、現在のシステムに関する関連情報を表示します。この情報には、オペレーティングシステムのプラットフォーム/アーキテクチャ/バージョン、バイナリ（Node.js、npm、Yarn、pnpm）、パッケージバージョン（next、react、react-dom）などが含まれます。
出力は次のようになります。
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 23.6.0
Available memory (MB): 65536
Available CPU cores: 10
Binaries:
Node: 20.12.0
npm: 10.5.0
Yarn: 1.22.19
pnpm: 9.6.0
Relevant Packages:
next: 15.0.0-canary.115 // Latest available version is detected (15.0.0-canary.115).
eslint-config-next: 14.2.5
react: 19.0.0-rc
react-dom: 19.0.0
typescript: 5.5.4
Next.js Config:
output: N/Anext info コマンドで使用できるオプションは以下のとおりです。
| オプション | 説明 |
|---|---|
-h または --help | 使用可能なすべてのオプションを表示します。 |
--verbose | デバッグのための追加情報を収集します。 |
next lint オプション
next lint は、pages/、app/、components/、lib/、src/ ディレクトリ内のすべてのファイルに対してESLintを実行します。また、ESLintがまだアプリケーションに設定されていない場合は、必要な依存関係をインストールするためのガイド付きセットアップも提供します。
next lint コマンドで使用できるオプションは以下のとおりです。
| オプション | 説明 |
|---|---|
[ディレクトリ] | アプリケーションをlintするベースディレクトリ。指定しない場合は、現在のディレクトリが使用されます。 |
-d, --dir, <dirs...> | ESLintを実行するディレクトリを指定します。 |
--file, <files...> | ESLintを実行するファイルを指定します。 |
--ext, [exts...] | JavaScriptファイルの拡張子を指定します。(デフォルト: [".js", ".mjs", ".cjs", ".jsx", ".ts", ".mts", ".cts", ".tsx"]) |
-c, --config, <config> | この設定ファイルを使用して、他のすべての設定オプションを上書きします。 |
--resolve-plugins-relative-to, <rprt> | プラグインを解決するディレクトリを指定します。 |
--strict | Next.jsの厳格な設定を使用して.eslintrc.jsonファイルを作成します。 |
--rulesdir, <rulesdir...> | このディレクトリから追加のルールを使用します。 |
--fix | リンティングの問題を自動的に修正します。 |
--fix-type <fixType> | 適用する修正の種類を指定します（例：problem、suggestion、layout）。 |
--ignore-path <path> | 無視するファイルを指定します。 |
--no-ignore <path> | --ignore-pathオプションを無効にします。 |
--quiet | エラーのみを報告します。 |
--max-warnings [maxWarnings] | ゼロ以外の終了コードをトリガーする警告の数を指定します。(デフォルト: -1) |
-o, --output-file, <outputFile> | レポートを書き込むファイルを指定します。 |
-f, --format, <format> | 特定の出力形式を使用します。 |
--no-inline-config | コメントによる設定またはルールの変更を防止します。 |
--report-unused-disable-directives-severity <level> | 使用されていないeslint-disableディレクティブの重大度レベルを指定します。(選択肢: "error", "off", "warn") |
--no-cache | キャッシュを無効にします。 |
--cache-location, <cacheLocation> | キャッシュの場所を指定します。 |
--cache-strategy, [cacheStrategy] | キャッシュ内の変更されたファイルを検出するために使用する戦略を指定します。(デフォルト: "metadata") |
--error-on-unmatched-pattern | ファイルパターンが一致しない場合にエラーを報告します。 |
-h, --help | このメッセージを表示します。 |
next telemetry オプション
Next.jsは、一般的な使用方法に関する**完全に匿名の**テレメトリデータを収集します。この匿名プログラムへの参加は任意であり、情報を共有したくない場合はオプトアウトできます。
next telemetry コマンドで使用できるオプションは以下のとおりです。
| オプション | 説明 |
|---|---|
-h, --help | 使用可能なすべてのオプションを表示します。 |
--enable | Next.jsのテレメトリデータ収集を有効にします。 |
--disable | Next.jsのテレメトリデータ収集を無効にします。 |
テレメトリの詳細については、こちらをご覧ください。
例
デフォルトポートの変更
デフォルトでは、Next.jsは開発中およびnext startを使用する場合にhttps://#:3000を使用します。デフォルトポートは、次のように-pオプションで変更できます。
next dev -p 4000または、PORT環境変数を使用します。
PORT=4000 next dev重要な注意点: HTTPサーバーの起動は他のコードが初期化される前に行われるため、
.envでPORTを設定することはできません。
開発中のHTTPSの使用
Webhookや認証などの特定のユースケースでは、HTTPSを使用して、localhostで安全な環境を実現できます。Next.jsは、--experimental-httpsフラグを使用してnext devで自己署名証明書を生成できます。
next dev --experimental-https生成された証明書を使用すると、Next.js開発サーバーはhttps://#:3000で存在します。-p、--port、またはPORTでポートを指定しない限り、デフォルトポート3000が使用されます。
--experimental-https-keyと--experimental-https-certでカスタム証明書とキーを指定することもできます。必要に応じて、--experimental-https-caでカスタムCA証明書を指定することもできます。
next dev --experimental-https --experimental-https-key ./certificates/localhost-key.pem --experimental-https-cert ./certificates/localhost.pemnext dev --experimental-httpsは開発目的のみを意図しており、mkcertを使用してローカルで信頼できる証明書を作成します。本番環境では、信頼できる認証機関から適切に発行された証明書を使用してください。
重要な注意点: Vercelにデプロイする場合、Next.jsアプリケーションのHTTPSは自動的に構成されます。
ダウンストリームプロキシのタイムアウトの設定
Next.jsをダウンストリームプロキシ（例：AWS ELB/ALBなどのロードバランサー）の背後にデプロイする場合、キープアライブタイムアウトをダウンストリームプロキシのタイムアウトよりも長く設定して、Next.jsの基礎となるHTTPサーバーを構成することが重要です。そうしないと、特定のTCP接続のキープアライブタイムアウトに達すると、Node.jsはダウンストリームプロキシに通知することなく、その接続をすぐに終了します。これにより、Node.jsが既に終了した接続を再利用しようとすると、プロキシエラーが発生します。
本番Next.jsサーバーのタイムアウト値を設定するには、次のように--keepAliveTimeout（ミリ秒単位）をnext startに渡します。
next start --keepAliveTimeout 70000Node.js引数の渡し方
任意のnode引数をnextコマンドに渡すことができます。例:
NODE_OPTIONS='--throw-deprecation' next
NODE_OPTIONS='-r esm' next
NODE_OPTIONS='--inspect' nextこの情報は役に立ちましたか？