ルートグループ
app
ディレクトリでは、ネストされたフォルダは通常URLパスにマッピングされます。しかし、フォルダをルートグループとしてマークすることで、そのフォルダがルートのURLパスに含まれないようにすることができます。
これにより、URLパス構造に影響を与えることなく、ルートセグメントとプロジェクトファイルを論理的なグループに整理することができます。
ルートグループは次のような場合に役立ちます
- ルートを、サイトセクション、目的、チームなどのグループに整理する。
- 同じルートセグメントレベルでネストされたレイアウトを有効にする
- 同じセグメント内に、複数のルートレイアウトを含む、複数のネストされたレイアウトを作成する
- 特定のセグメントをレイアウトにオプトインする
- 特定のルートでローディングスケルトンをオプトインする
規約
ルートグループは、フォルダ名を括弧で囲むことで作成できます: (folderName)
知っておくと良いこと:
- ルートグループの命名は、整理以外の特別な意味を持ちません。URLパスには影響しません。
- ルートグループを含むルートは、他のルートと同じURLパスに解決してはいけません。例えば、ルートグループはURL構造に影響しないため、
(marketing)/about/page.js
と(shop)/about/page.js
は両方とも/about
に解決され、エラーの原因となります。- トップレベルの
layout.js
ファイルなしで複数のルートレイアウトを使用する場合、ホームページのpage.js
ファイルはルートグループのいずれかに定義する必要があります。例:app/(marketing)/page.js
。- 複数のルートレイアウトをまたいでナビゲートすると、(クライアントサイドナビゲーションとは異なり)フルページロードが発生します。例えば、
app/(shop)/layout.js
を使用する/cart
から、app/(marketing)/layout.js
を使用する/blog
へナビゲートすると、フルページロードが発生します。これは複数のルートレイアウトの場合にのみ適用されます。
これは役に立ちましたか?