sveltejs/svelte

Better ergonomics for the `{@const...}` syntax

Closed this issue · 1 comments

Describe the problem

Now that the async and remote function features have been pushing variable declaration into the markup section even more than before, I more than often need to declare multiple of them. However, a pair of parentheses only allows one at a time:

{@const foo =await fn1()}
{@const bar = await fn2()}
{@const fooDerivative = doSomething(foo)}
{@const barDerivative = doSomethingElse(bar)}
{@const baz = combine(fooDerived, barDerived)
//etc

It's a minor issue but kinda annoying. Doesn't feel like I'm writing js anymore.
Habitual key sequence: ; + Enter + const.
Now it requires: Shift+] + Enter + Shift+[ + @ + const;

Describe the proposed solution

I'm not sure what the solution should look like. Should it be allowed to move everything back to the script section but avoid the waterfall issue with consecutive await? Should it be a new section where we can write JS freely like <script markup (similar to <script module)? I remember the days when Svelte was sold as just vanilla html, JS, and css with a sprinkle of magic on top of them. Now it's functionally better but doesn't feel like so anymore.

Importance

nice to have

We're planning on addressing this in #16490.