sveltejs/kit

Add $routes type alias

Fermée

#13 517 ouverte le 28 févr. 2025

 (2 commentaires) (2 réactions) (0 personne assignée)JavaScript (1 719 forks)batch import
feature / enhancementhelp wantedneeds-decision

Métriques du dépôt

Stars
 (17 446 étoiles)
Métriques de merge PR
 (Merge moyen 17j 22h) (184 PRs mergées en 30 j)

Description

Describe the problem

I'd love to use route data directly in $lib/components instead of passing props to reduce type boilerplate. This is possible with page.data from $app/state, but it lacks proper types, requiring manual type assertions:

import { page } from '$app/state';
import type { PageData } from "../../routes/listings/$types";

const { carsCount } = $derived(page.data as PageData)

The main challenge is importing the correct PageData type, especially in deeply nested components and routes - path can quickly become cumbersome.

Describe the proposed solution

I'd love to have $routes alias which points directly to generated route types so I can use it in any part of the app:

import { page } from '$app/state';
import type { PageData } from "$routes/listings/$types";

const { carsCount } = $derived(page.data as PageData)

It's already working by providing alias in svelte.config.js:

export default {
  kit: {
    alias: {
      $routes: '.svelte-kit/types/src/routes'
    }
  }
}

Would be nice to have it right of the box 🥳

Alternatives considered

Some generic with route path param would also be fine

Importance

would make my life easier

Additional Information

No response

Guide contributeur