[HN Gopher] Svelte and TypeScript
___________________________________________________________________
Svelte and TypeScript
Author : kevinak
Score : 154 points
Date : 2020-07-21 15:07 UTC (7 hours ago)
(HTM) web link (svelte.dev)
(TXT) w3m dump (svelte.dev)
| nickreese wrote:
| Having talked to a ton of friends about Svelte, Typescript
| support has always been the biggest push-back for adoption.
|
| Stoked for Svelte to support it.
|
| We've been using Svelte in production and I can't speak highly
| enough about the developer experience. Absolute game changer for
| our ssite that use it.
| G4BB3R wrote:
| Do you use pure svelte or with sapper? how is it compared to
| react?
| nickreese wrote:
| We wrote our own SSG for https://elderguide.com. We tried
| Sapper but our data flow and routing needs were to complex
| and not a fit.
|
| Svelte is a dream compared to React. That said, I've never
| felt like React was the right solution for the problem.
|
| I've extensively used Gatsby and for static sites, React is
| absolutely overkill. For apps it can be nice.
|
| In both cases my go-to these days is Svelte.
| lurker42 wrote:
| submitting your contact form without any filled in details
| throws a graphql mutation error :)
| uxcolumbo wrote:
| Nice site and real snappy.
|
| I haven't used Svelte yet - but am interested.
|
| Can you explain a bit more about what you mean with your
| data flow and routing needs were too complex for Sapper.
|
| And what makes Svelte a dream compared to React?
| The_rationalist wrote:
| What would it bring in ergonomics and expressivity versus Vue ?
| kjksf wrote:
| Those things really need to be experienced to be understood,
| so just try Svelte in a toy project. Or go through the
| interactive tutorial https://svelte.dev/tutorial/basics
|
| I used both React and Vue and am now only using Svelte.
|
| You type less. Significantly less.
|
| The thing you type is simpler. I tend to get lost in Vue's
| object structure.
|
| What you type is closer to HTML/CSS/JavaScript than what you
| type in React/Vue. It's therefore easier to understand what
| gets generated.
|
| The seamless reactivity is awesome.
|
| Scoped CSS support is built-in so you don't need css-in-js
| hacks.
|
| Built-in support for data (stores) is excellent.
|
| The final bundle is smaller and faster.
|
| There's more but the above are the major points.
|
| The only downside is smaller ecosystem. But I don't care
| because I'm in the camp of minimizing my dependencies.
| nickreese wrote:
| I haven't used Vue extensively since what was probably v1 so
| I'm likely the wrong person to comment on this.
|
| That said, I find that Svelte aligns more with my/our team's
| mental model about how the web should work and that is why
| went with it for our sites.
|
| Just like with Vue you can write your JS/CSS/HTML in a single
| file, but the reactivity and state management is much easier
| to reason about than what we've seen elsewhere.
|
| - `$:` is great.
|
| - Stores and derived stores are amazing.
|
| - Data binding / rerendering is really intuitive.
|
| That said, the biggest headache in building our own SSG was
| getting SSR/Hydration working well, but that was mainly
| fighting Webpack and got easier when we went with Rollup.
|
| edit: formatting.
| vosper wrote:
| Lack of Typescript support was the main reason I didn't switch to
| Svelte for my personal projects. Other than that it was a joy to
| use, and a breath of fresh air in it's approach.
|
| I'd recommend any front-end dev to give Svelte a try, even just
| spending an hour or two messing around, to experience a way of
| developing web apps that's likely a bit different to what you're
| used to, but feels familiar enough that it doesn't require a big
| mental leap.
| Vinnl wrote:
| It's really telling that, for every big project that does not
| support TypeScript, the number 1 feature request is TypeScript
| support. (And consequently, that there are fewer and fewer such
| projects.)
| swyx wrote:
| indeed we are in a new age of javascript now. one where TS
| support is (in practice) not optional.
| https://www.swyx.io/writing/js-third-age/
| swyx wrote:
| this has been eagerly anticipated for so long and is probably the
| #1 stated reason why people haven't tried out Svelte yet. so glad
| this is out!
| outime wrote:
| It definitely was my #1 reason and I'm happy to see this
| announcement. I'll check Svelte out soon as it already looked
| quite promising to me.
| zeroc8 wrote:
| Would love to use it, but I need something comparable to PrimeNG.
| Are there any comprehensive UI toolkits out there already?
| widgetic wrote:
| Some - https://awesomeopensource.com/project/ryanatkn/awesome-
| svelt...
| fb03 wrote:
| I was literally searching for this like, a week ago. Glad to
| finally see it land in a stable, first-class manner.
| swyx wrote:
| Here are some tutorials from community members who knew this was
| coming:
|
| - 3 min youtube demo:
| https://www.youtube.com/watch?v=djRkyyBoIKs&feature=youtu.be
|
| - 3 min eggheadio lesson: https://egghead.io/lessons/svelte-
| create-a-new-svelte-projec...
|
| - TS + Sapper: https://mrsauravsahu.github.io/blog/38/
| The_rationalist wrote:
| How is Webstorm support with Svelte ?
| BMorearty wrote:
| Not bad. I've been using the Svelte plugin by Tomasz Blachut.
| But I don't think the plugin supports TypeScript yet.
| mrath wrote:
| I believe there is no official plugin for Svelte. So it may not
| be as good as the support for React/Angular/Vue. But once
| Svelte is a bit more popular, I think JetBrains will release a
| plugin.
| lurker42 wrote:
| you can use the LSP and get most things working.
| dboreham wrote:
| Switching from JS to Typescript was like moving from machine code
| to C. Note: machine code (hex) not assembler.
| untog wrote:
| Very happy about this. I tried to combine the two a few months
| ago and it was not a fun experience. Great to know I can give it
| another go now.
| zamalek wrote:
| I've been using Svelte TS for a pet project for maybe 2 weeks
| now. It's fantastic. The VSCode plugin is also doing a great job.
|
| I tried, and failed, to use Babel as the TS compiler - but TSC
| then Babel works just fine.
| seanwilson wrote:
| Are the HTML templates type checked as well?
|
| I'm playing with Vue version 3 with TypeScript using JSX instead
| of the usual HTML templates and pretty happy that it's all type
| checked. I have a similar project without JSX and the vast
| majority of the bugs are related to the logic in the HTML
| templates not being type checked.
| dlbucci wrote:
| This has been my experience with AngularJS 1 and TypeScript as
| well. Looks like there's at least some support for it (Quote
| the link: You get autocompletion hints and type-checking as
| you're writing components, even in expressions inside markup).
| Not sure if it does things like restrict `value` to `input`
| elements or anything, or if it's just the expressions in the
| template.
| smt88 wrote:
| Try using Vue in WebStorm with their Vue plugin enabled, or use
| TSX with any IDE. Your "HTML" will be type-checked.
| swyx wrote:
| yes - tho coverage isn't 100% perfect. still need help to cover
| some things, this is a very large surface area to cover
| https://github.com/sveltejs/language-tools/issues/
| drol3 wrote:
| Great news!
|
| Was my only blocker :)
___________________________________________________________________
(page generated 2020-07-21 23:00 UTC)