Skip to content

When omitting $types, the type assigned to page load differs from PageLoad #12483

Open
@benblank

Description

@benblank

Describe the bug

When omitting $types from +page.ts, the return type of the load doesn't seem to be checked correctly. When typed as PageLoad, required properties in PageData which aren't present in the return type cause a type error. If the types are omitted (as described in the blog post), the type error no longer occurs.

Reproduction

  1. Run npm create svelte@latest repro && cd repro && npm install (select "Skeleton project", "Yes, using TypeScript syntax", and no additions).

  2. Run npm run check — no errors or warnings, yet.

  3. Edit src/app.d.ts; uncomment PageData and give it the properties { foo: string; bar: string; }.

  4. Create src/routes/+page.ts with the contents:

    import type { PageLoad } from './$types';
    
    export const load: PageLoad = () => {
      return { foo: "exists" };
    };
  5. Run npm run check again — this time, there's a type error saying that "Property 'bar' is missing …" (shown in full in the "Logs" section).

  6. Edit src/routes/+page.ts, removing the import and type annotation.

  7. Run npm run check one more time — the type error is no longer reported.

(The same behavior can be seen when using VS Code instead of running svelte-check directly.)

Logs

> [email protected] check /home/five35/Documents/tmp/omit-types-repro
> svelte-kit sync && svelte-check --tsconfig ./tsconfig.json


====================================
Loading svelte-check in workspace: /home/five35/Documents/tmp/omit-types-repro
Getting Svelte diagnostics...

/home/five35/Documents/tmp/omit-types-repro/src/routes/+page.ts:3:14
Error: Type '() => { foo: string; }' is not assignable to type 'PageLoad'.
  Type '{ foo: string; }' is not assignable to type 'MaybePromise<Omit<PageData, never> & Partial<Pick<PageData, never>> & Record<string, any>>'.
    Type '{ foo: string; }' is not assignable to type 'Omit<PageData, never> & Partial<Pick<PageData, never>> & Record<string, any>'.
      Property 'bar' is missing in type '{ foo: string; }' but required in type 'Omit<PageData, never>'. 

export const load: PageLoad = () => {
  return { foo: "exists" };


====================================
svelte-check found 1 error and 0 warnings in 1 file
 ELIFECYCLE  Command failed with exit code 1.

System Info

System:
    OS: Linux 6.8 Ubuntu 24.04 LTS 24.04 LTS (Noble Numbat)
    CPU: (4) x64 Intel(R) Core(TM) i7-5600U CPU @ 2.60GHz
    Memory: 2.64 GB / 7.63 GB
    Container: Yes
    Shell: 5.2.21 - /bin/bash
  Binaries:
    Node: 20.13.1 - ~/.local/share/asdf/installs/nodejs/20.13.1/bin/node
    Yarn: 1.22.22 - ~/.local/share/asdf/installs/nodejs/20.13.1/bin/yarn
    npm: 10.5.2 - ~/.local/share/asdf/plugins/nodejs/shims/npm
    pnpm: 9.5.0 - ~/.local/share/asdf/installs/nodejs/20.13.1/bin/pnpm
  npmPackages:
    @sveltejs/adapter-auto: ^3.0.0 => 3.2.2 
    @sveltejs/kit: ^2.0.0 => 2.5.18 
    @sveltejs/vite-plugin-svelte: ^3.0.0 => 3.1.1 
    svelte: ^4.2.7 => 4.2.18 
    vite: ^5.0.3 => 5.3.4

Severity

serious, but I can work around it

Additional Information

I'm new to Svelte and SvelteKit, so it's possible this is user error or expected behavior, but I wasn't able to find anything in the documentation or the blog article which indicates that the type of load should be anything other than PageLoad. (In fact, export const load: PageLoad = … is used in an example on the types page.)

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions