Open
Description
Ways that types in SvelteKit apps could be improved:
Implicit params
and props
for load
functions (update: done)
<script context="module">
/** @type {import('@sveltejs/kit').Load */
export async function load({ params, fetch }) {
// `params` automatically typed from filename (e.g. `src/routes/blog/[slug]`)
const res = await fetch(`/blog/${params.slug}.json`);
const { post } = await res.json();
return {
props: {
// `post` type automatically inferred from component props
post
}
};
}
</script>
<script>
/** @type {BlogPost} */
export let post;
</script>
Similarly, with shadow endpoints, it would be good to type body
based on component props (though this could be tricky since component props combine e.g. post
and get
bodies), and also type the props
input to load
in cases where it's used.
It might be possible to do something clever with rootDirs, or with preprocessors?
Typed goto
and fetch
As mentioned below, it might be possible to type functions like goto
based on the available routes. It probably gets tricky with relative routes, but that could be a bailout.
Typed links
This is a little tricky for us, since we use <a>
instead of <Link>
, but it would be neat if it was possible to typecheck links somehow.