Svelte 5: TypeScript types for snippets are not removed

andersekdahl commented 7 months ago

Describe the bug

TypeScript types like these: https://github.com/andersekdahl/svelte5-snippet-repro/blob/main/src/lib/MyComponent.svelte#L4

Are not removed when building, as seen here: https://github.com/andersekdahl/svelte5-snippet-repro/blob/main/dist/MyComponent.svelte#L3

Reproduction

Created a new library project using sveltekit with the latest svelte 5 release here: https://github.com/andersekdahl/svelte5-snippet-repro

Running npm run package will build the code and the issue is visible in the dist folder which I also commited to make it easier to spot the problem.

Logs

No response

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (16) x64 11th Gen Intel(R) Core(TM) i9-11950H @ 2.60GHz
    Memory: 11.02 GB / 31.73 GB
  Binaries:
    Node: 20.11.1 - C:\Program Files\nodejs\node.EXE
    npm: 10.2.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Chromium (122.0.2365.80)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    svelte: ^5.0.0-next.1 => 5.0.0-next.75

Severity

blocking an upgrade

brunnerh commented 7 months ago

Repository seems to be private.

andersekdahl commented 7 months ago

@brunnerh Wops! Sorry, fixed now.

tommyminds commented 7 months ago

Thanks for the bug report! I'm running into the same issue

dummdidumm commented 7 months ago

This is tricky. The strip happens in @sveltejs/package because historically Svelte was then free of code needing to be preprocessed. But now that Svelte handles TypeScript in the template, just running a TypeScript preprocessor on the code will remove the TS code in the script tag but not in the template. The solution is to

either keep the lang="ts" tag so that the Svelte parser can recognize TypeScript code, and take the hit of a needless script TypeScript preprocessing
or to have some way to tell Svelte to remove the TypeScript parts from the template, which probably needs a separate method from svelte/compiler, like transpile
or it becomes part of preprocess automatically, not sure

I prefer the second or third option, because the first option would mean consumers of the library would be required to install TypeScript and set up the preprocessor for it.

dummdidumm commented 6 months ago

We decided to make this a special-case in @sveltejs/package: lang="ts" will be preserved in it so that the Svelte parser knows how to handle it. As a follow-up we can likely omit preprocessing TypeScript inside Svelte entirely; Svelte itself can handle that now.

sveltejs / svelte