`vite` and `@sveltejs/kit` types include `@types/node` in the browser context

Describe the bug

my project has some code that's executed in the browser and other code that's executed by node, so i need to have @types/node installed. unfortunately, the generated .svelte-kit/tsconfig.json includes files (such as ambient.d.ts and vite.config.ts) that rely on node types.

you can see this by disabling skipLibCheck the your project's tsconfig.json then running tsc:

> tsc
node_modules/@sveltejs/kit/types/ambient.d.ts:426:19 - error TS2307: Cannot find module 'http' or its corresponding type declarations.

426   request: import('http').IncomingMessage;
                      ~~~~~~

node_modules/@sveltejs/kit/types/ambient.d.ts:429:42 - error TS2307: Cannot find module 'http' or its corresponding type declarations.

429  export function setResponse(res: import('http').ServerResponse, response: Response): void;
                                             ~~~~~~

node_modules/@sveltejs/kit/types/internal.d.ts:114:28 - error TS2580: Cannot find name 'Buffer'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node`.

114    read: (file: string) => Buffer;
                               ~~~~~~

node_modules/@sveltejs/kit/types/internal.d.ts:391:27 - error TS2580: Cannot find name 'Buffer'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node`.

391  read?: (file: string) => Buffer;
                              ~~~~~~

node_modules/sass/types/legacy/render.d.ts:26:8 - error TS2580: Cannot find name 'Buffer'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node`.

26   css: Buffer;
          ~~~~~~

node_modules/sass/types/legacy/render.d.ts:56:9 - error TS2580: Cannot find name 'Buffer'. Do you need to install type definitions for node? Try `npm i --save-dev @types/node`.

56   map?: Buffer;
           ~~~~~~

node_modules/svelte/types/compiler/interfaces.d.ts:1:53 - error TS2307: Cannot find module 'estree' or its corresponding type declarations.

1 import { AssignmentExpression, Node, Program } from 'estree';
                                                      ~~~~~~~~

node_modules/vite/dist/node/index.d.ts:1:23 - error TS2688: Cannot find type definition file for 'node'.

1 /// <reference types="node" />
                        ~~~~

(ommitted the rest of the errors but there's like 50)

after installing @types/node, typescript now incorrectly treats svelte code as if it's run by nodejs:

<script lang='ts'>
    const a = setTimeout(() => 1, 1)
    a + 1 // Error: Operator '+' cannot be applied to types 'Timeout' and 'number'. (ts)
</script>

(in nodejs, setTimeout returns a Timeout object but in the browser it returns a number)

adding "typeRoots": [] and "types": [] in tsconfig.json does not help because @types/node is still being included by files matched by the include section in .svelte-kit/tsconfig.json

Reproduction

https://stackblitz.com/edit/sveltejs-kit-template-default-nxgj43?file=src%2Froutes%2F%2Bpage.svelte

Logs

No response

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 7.17.0 - /usr/local/bin/npm
  npmPackages:
    @sveltejs/adapter-auto: ^2.0.0 => 2.0.0 
    @sveltejs/kit: ^1.5.0 => 1.10.0 
    svelte: ^3.54.0 => 3.55.1 
    vite: ^4.0.0 => 4.1.4

Severity

serious, but I can work around it

Additional Information

• every svelte project has config files such as vite.config.ts, and @types/node is needed for those files to be correctly type checked
• @playwright/test depends on @types/node so this issue is unavoidable if you select playwright in the npm svelte create menu
• related typescript issue: https://github.com/microsoft/TypeScript/issues/50424

Start by running tsc with skipLibCheck disabled, then inspect the generated .svelte-kit/tsconfig.json, its include entries, and the referenced ambient.d.ts and vite.config.ts files. Use src/routes/+page.svelte to verify that browser code keeps browser typings while configuration files can use Node typings; done means the reported errors are resolved without changing setTimeout to return Node's Timeout in Svelte code.