🦋 Changeset detected

Latest commit: 8f5a073

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Preview: https://svelte-dev-git-preview-svelte-16192-svelte.vercel.app/

Playground

pnpm add https://pkg.pr.new/svelte@16192

Fun idea from bsky — using x = $derived(...). Like regular using this would also be disposed on component unmount, but would additionally be disposed when the derived updated. Not quite sure what would happen outside the top level of a component though... maybe it would be forbidden to use it with unowned deriveds

Fun idea from bsky — using x = $derived(...). Like regular using this would also be disposed on component unmount, but would additionally be disposed when the derived updated. Not quite sure what would happen outside the top level of a component though... maybe it would be forbidden to use it with unowned deriveds

So that would be like a 1 time $derived value?

Would be nice to have corresponding template syntax {@using ...}

This probably closes #8973

Would be nice to have corresponding template syntax {@using ...}

Hm... How it could be useful?

Hm... How it could be useful?

The usage is the same as the top-level declaration, only in the #if, #each and #snippet blocks

If a real example is needed, I would like to get rid of onDestroy in this method, example usage.

Could anyone clarify status of support using, top-level and non-top-level in .svelte-files?

Now in any configuration in svelte.config.js:

preprocess: vitePreprocess()
// or
preprocess: vitePreprocess({ script: true })

and level:

• Top-level - https://svelte.dev/playground/0b15ab7909c04585b6d07ff817a119f7?version=5.46.4
• Non-top-level - https://svelte.dev/playground/16620a66d4194f11902a3fc40f05a62d?version=5.46.4

I get error:

Unexpected token
https://svelte.dev/e/js_parse_error

But there are at least 2 places that say that it should work:

1. https://svelte.dev/docs/svelte/typescript#Preprocessor-setup-Other-build-tools

To use non-type-only TypeScript features within Svelte components, you need to add a preprocessor that will turn TypeScript into JavaScript.

2. https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/preprocess.md

TypeScript is no longer preprocessed by default as Svelte 5 understands most syntax natively. If you use TypeScript features that emit code (like enum, using, accessors, decorators or class declarations with visibility modifiers), you have to enable the script preprocessor by setting the script option to true.

These documentation are wrong?

This isn't a merged feature, Svelte currently doesn't support parsing using declarations. If you want to try it out, install using this command:

pnpm add https://pkg.pr.new/svelte@16192