devIndicators
devIndicators は、開発中に表示される現在のルートに関するコンテキストを提供する画面上のインジケーターを設定できます。
型
devIndicators: false | {
position?: 'bottom-right'
| 'bottom-left'
| 'top-right'
| 'top-left', // defaults to 'bottom-left',
},devIndicators を false に設定するとインジケーターは非表示になりますが、Next.js は発生したビルドまたは実行時エラーを表示し続けます。
トラブルシューティング
Indicator not marking a route as static
ルートが静的であると期待しているのに、インジケーターが動的であるとマークしている場合、そのルートは静的レンダリングをオプトアウトしている可能性が高いです。
next build --debug を使用してアプリケーションをビルドし、ターミナルの出力を確認することで、ルートが 静的 か 動的 かを確認できます。静的(またはプリレンダリングされた)ルートには ○ シンボルが表示され、動的ルートには ƒ シンボルが表示されます。例:
ビルド出力
Route (app)
┌ ○ /_not-found
└ ƒ /products/[id]
○ (Static) prerendered as static content
ƒ (Dynamic) server-rendered on demandルートが静的レンダリングをオプトアウトする理由は 2 つあります。
- 実行時情報に依存する 動的 API の存在。
- ORM やデータベースドライバーへの呼び出しのような、キャッシュされていないデータリクエスト。
これらの条件のいずれかがルートにあるかどうかを確認してください。ルートを静的にレンダリングできない場合は、loading.js または <Suspense /> を使用して ストリーミング を活用することを検討してください。
バージョン履歴
| バージョン | 変更履歴 |
|---|---|
v16.0.0 | appIsrStatus、buildActivity、buildActivityPosition オプションは削除されました。 |
v15.2.0 | 新しい position オプションで改善された画面上インジケーター。appIsrStatus、buildActivity、buildActivityPosition オプションは非推奨になりました。 |
v15.0.0 | appIsrStatus オプションで静的な画面上インジケーターが追加されました。 |
役に立ちましたか?