Hacker News new | ask | show | jobs
by candiddevmike 1612 days ago
Another question, how are people actually using Typescript with Svelte? It seems like you can't use $some.prop = avalue, it can't be type checked, so wtf is the point of using Typescript with Svelte?
3 comments

Having used Typescript with Svelte, I think that Typescript is still potentially useful, just not directly in `.svelte` files. There's nothing wrong with keeping all your business logic in separate `.ts` files and then importing them into your Svelte components, because those components can and often are primarily view logic, and the utility of having everything type-checked down to the template level is... not particularly significant IMO. If your Typescript modules are still type-checked and pass tests, then I find trying to make a Svelte project Typescript all the way down to be kind of paranoid.

To each their own, but I think life's too short to be adding types to your view logic and your templates. It adds so much complexity for so little gain. Maybe it'll get better at some point where it will change my mind, in particular when using something like Deno.

I'm not sure about "$some.prop = avalue", but props are declared as exports of your component [1], and they can be given types. Perhaps you're refering to "$$props"? The only time I've hacked into the component variables is to check whether slot is set.

[1]: https://svelte.dev/tutorial/declaring-props

Damn I was hoping Svelte had proper Typescript support given that they claim that Svelte officially supports TypeScript. Is it just like Vue - it "supports" it, but there's still important stuff that's not type checked at compile time?
Well, good news for you, it does! Very well, in fact. Svelte itself is written in TypeScript.
So is he wrong about not being able to type check that then?
Well, yes, to my understanding. If you add lang="ts" to the script block, you can write normal TypeScript code for the component logic, and it will also check props that you are passing to child components in the template. It's like renaming the file from ".jsx" to ".tsx". It might not be perfect, but I haven't encountered any problems with it so far.
Vue 3 is written in typescript and does type check props at both compile time and runtime.
Not very nicely: https://v3.vuejs.org/guide/typescript-support.html#annotatin...

Does it type check templates yet?

Nobody should still use the awful legacy vue component syntax, it is trivial and much cleaner to migrate to script setup components, which do provide properly type checked props easily https://v3.vuejs.org/api/sfc-script-setup.html#defineprops-a... https://v3.vuejs.org/api/sfc-script-setup.html#typescript-on... (although vue class component is still the best API of all VDOMs, it's unfortunate its development has stalled)

Webstorm now properly supports template type checking too https://blog.jetbrains.com/webstorm/2021/11/webstorm-2021-3/...

Nobody should use the thing that the documentation tells you to use...

Vue 3 looks a lot better than Vue 2 but honestly it's just playing catch up to React. I don't know why you'd choose it.

It might interest you that Wikipeida chose Vue to modernise its frontend in the future [1]. Different frameworks offer different benefits and different downsides.

React is not the end-all, nor will it ever be, as long as there are interesting new projects coming out, and neither is Vue or Svelte. My website uses React, but personally I would rather use Vue or Svelte in the future.

[1]: https://phabricator.wikimedia.org/T241180