sveltejs/language-tools

Weird typing when using `bun` as a language server runtime.

Open

#2,560 opened on Nov 4, 2024

 (2 comments) (0 reactions) (0 assignees)TypeScript (247 forks)auto 404
bughelp wanted

Repository metrics

Stars
 (1,437 stars)
PR merge metrics
 (PR metrics pending)

Description

Describe the bug

When you are using Svelte 5 in conjunction with VSCode, the official Svelte extension, Typescript and you set svelte.language-server.runtime as well as typescript.tsserver.nodePath to bun, you get very different and weird behavior if you import from a .svelte file into a normal .ts versus when you import from .svelte into another .svelte (or .svelte.ts) file.

See the following screenshots as a reference:

Import into .svelte: image

Import into .ts image

In both cases, import happens from this basic component but the results are very different:

// this is the component
<script lang="ts" module>
    export type Props = {
        onclick?: () => void;
    };
</script>

<script lang="ts">
    let { onclick }: Props = $props();
</script>

<button type="button" {onclick}> click </button>

Weird: (1) I can get the type of component as the return type of a function in a .svelte but in a .ts the same import is not a function but a class. (2) I can not import whatever types a Svelte[context=module] exports in a .ts file, but I can import it in a .svelte file. (3) I can use the ComponentProps helper in a .svelte file but it won't work in .ts due to (1) and I can't seem to find a way to access the typings of a component's props in a .ts file otherwise.

Reproduction

  • Check out this Repo: https://github.com/ptrxyz/s5-import-problems
  • Configure VSCode to make the svelte language server use bun as runtime (settings ID svelte.language-server.runtime)
  • Configure VSCode's Typescript feature to also use bun as runtime (settings ID typescript.tsserver.nodePath)
  • Navigate to src/lib/test.ts / src/lib/test.svelte in VSCode and see the difference.

Expected behaviour

Probably the same behavior no matter what JS runtime I use.

System Info

System: OS: Linux 6.11 Arch Linux CPU: (24) x64 AMD Ryzen 9 5900X 12-Core Processor Memory: 51.40 GB / 62.71 GB Shell: 5.9 - /usr/bin/zsh Binaries: Node: 23.1.0 - /usr/bin/node Yarn: 1.22.22 - /usr/bin/yarn npm: 10.9.0 - /usr/bin/npm pnpm: 9.12.3 - /usr/bin/pnpm bun: 1.1.34 - ~/bin/bun Browsers: Brave Browser: 130.1.71.121 Chromium: 130.0.6723.91

IDE: VSCode Version: 1.95.1 Commit: 65edc4939843c90c34d61f4ce11704f09d3e5cb6 Date: 2024-10-31T05:14:54.222Z Electron: 32.2.1 ElectronBuildId: 10427718 Chromium: 128.0.6613.186 Node.js: 20.18.0 V8: 12.8.374.38-electron.0 OS: Linux x64 6.11.6-arch1-1

Extension: svelte.svelte-vscode version v109.1.0 vscode.typescript-language-features v1.0.0 (built-in)

Typescript: version 5.6.3

Which package is the issue about?

No response

Additional Information, eg. Screenshots

No response

Contributor guide