sveltejs/kit

Add $routes type alias

Fechada

#13.517 aberto em 28 de fev. de 2025

 (2 comentários) (2 reações) (0 responsável)JavaScript (1.719 forks)batch import
feature / enhancementhelp wantedneeds-decision

Métricas do repositório

Stars
 (17.446 estrelas)
Métricas de merge de PR
 (Mesclagem média 17d 22h) (184 fundiu PRs em 30d)

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

Guia do colaborador