Pathless Layouts and Route Groups
Quick Reference — TanStack Router
Pathless Layouts (Underscore Prefix)
Purpose: Wrap child routes with shared UI/logic without adding URL segment
Syntax: Prefix filename with _
routes/
├── __root.tsx
├── _authenticated.tsx
│ ├── _authenticated.index.tsx → /
│ └── _authenticated.dashboard.tsx → /dashboard
└── login.tsx
Route Groups (Parentheses Prefix)
Purpose: Organize files in folders without affecting URLs
Syntax: Wrap folder name in ( )
routes/
├── (marketing)/
│ ├── (marketing).index.tsx → /
│ └── (marketing).about.tsx → /about
└── (app)/
When to Use What
| Use Case |
Tool |
| Share header/sidebar across routes |
Pathless layout |
| Run auth checks before child loads |
Pathless layout |
| Organize many routes at same level |
Route group |
| Separate public/auth routes in file tree |
Route group |