Typed routes don't work well with reroute hook
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 20.8k
- Forks
- 2.3k
- Avg merge
- 1d 16h
- Merged PRs (30d)
- 156
Description
Describe the bug
Problem
When using SvelteKit's typed routes feature with the reroute hook, TypeScript errors occur for rerouted paths that don't exist in the actual file structure.
Example
// src/hooks.ts
import type { Reroute } from '@sveltejs/kit';
const translated: Record<string, string> = {
'/about': '/about',
'/ueber-uns': '/about',
'/a-propos': '/about',
};
export const reroute: Reroute = ({ url }) => {
if (url.pathname in translated) {
return translated[url.pathname];
}
};
Issue
When checking against rerouted paths in the about page:
// src/routes/about/+page.svelte
let isGermanRoute = $derived(page.url.pathname === '/ueber-uns');
let isFrenchRoute = $derived(page.url.pathname === '/a-propos');
TypeScript throws errors:
Error: This comparison appears to be unintentional because the types
'"/about" | "/" | `/${string}/about` | `/${string}/`' and '"/ueber-uns"' have no overlap.
Error: This comparison appears to be unintentional because the types
'"/about" | "/" | `/${string}/about` | `/${string}/`' and '"/a-propos"' have no overlap.
The Problem
The typed routes system only knows about paths that exist in the file structure (/about), but doesn't know about the rerouted paths /ueber-uns and /a-propos. This makes it impossible to check the current pathname against rerouted URLs without TypeScript errors.
Expected behavior
There should be a way to inform the typed routes system about paths created through the reroute hook, or at least a recommended pattern to avoid these TypeScript errors while maintaining type safety.
Current Workarounds
- Use type assertions:
(page.url.pathname as string) === '/ueber-uns' - Disable type checking:
// @ts-ignore - Avoid pathname comparisons for rerouted paths
None of these solutions are ideal as they reduce type safety and developer experience.
Reproduction
https://github.com/devunt/sveltekit-reroute-typed-route-repro
Logs
-
System Info
System:
OS: macOS 15.5
CPU: (14) arm64 Apple M3 Max
Memory: 437.69 MB / 36.00 GB
Shell: 4.0.2 - /opt/homebrew/bin/fish
Binaries:
Node: 24.4.0 - ~/.local/share/mise/installs/node/24.4.0/bin/node
npm: 11.4.2 - ~/.local/share/mise/installs/node/24.4.0/bin/npm
pnpm: 10.13.1 - ~/.local/share/mise/installs/node/24.4.0/bin/pnpm
Browsers:
Chrome: 138.0.7204.169
Safari: 18.5
npmPackages:
@sveltejs/kit: ^2.26.1 => 2.26.1
@sveltejs/vite-plugin-svelte: ^6.1.0 => 6.1.0
svelte: ^5.37.0 => 5.37.0
vite: ^7.0.6 => 7.0.6
Severity
serious, but I can work around it
Additional Information
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the reroute hook in src/hooks.ts and the pathname comparisons in src/routes/about/+page.svelte, then reproduce the errors using the linked repository. Determine how typed routes should represent paths introduced by reroute while preserving type safety; done means the rerouted pathname comparisons type-check without assertions or ts-ignore.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100