From 1.0.0-next.286 how to correctly type the Load function?

[frederikhors]

After upgrade from 1.0.0-next.285 to 1.0.0-next.286 I have an error using this code:

<script context="module" lang="ts">
	import type { LoadInput, LoadOutput } from "@sveltejs/kit";

	export function load({ url }: LoadInput): LoadOutput {
		//...
	}
</script>

Now if I copy the code from https://kit.svelte.dev/docs/loading:

<script context="module" lang="ts">
  /** @type {import('@sveltejs/kit').Load} */
  export function load({ url }) {
    //...
  }
</script>

the url is any.

Why?

Am I wrong using it?

[mustofa-id]

There is breaking changes about type on 1.0.0-next.286. The LoadInput and LoadOutput now exported from @sveltejs/kit/types/private. So the correct code should be:

<script context="module" lang="ts">
	import type { LoadInput, LoadOutput } from "@sveltejs/kit/types/private";

	export function load({ url }: LoadInput): LoadOutput {
		//...
	}
</script>

I prefer using function expression because it simply import only Load type.

<script lang="ts" context="module">
	import type { Load } from '@sveltejs/kit'

	export const load: Load = async ({ url }) => {
		// url === URL
		return {}
	}
</script>

[mustofa-id]

It should be:

export const load: ErrorLoad = ({ status }) => {
	return { props: { status } }
}

or if you prefer function declaration:

export function load({ status }: ErrorLoadInput): LoadOutput {
	return { props: { status } }
}

[frederikhors]

or if you prefer function declaration:

My question here is about this indeed! 😄

[mustofa-id]

Ah sorry. I mean you cannot use ErrorLoad if you use function declaration.

[frederikhors]

But why is it changed?

[mustofa-id]

There is a reason in the link in my first answer.