ITADN

Docs: clarify that bare `{const}` is not reactive, unlike the `{@const}` it replaces

#18356Closedhanszoons 创建于 2026-06-01
H
hanszoonscommented
### Describe the bug The [declaration-tags docs](https://svelte.dev/docs/svelte/declaration-tags) say `{@const ...}` is legacy and to use `{const ...}` instead, but don't mention that the two behave differently. `{@const x = e}` was reactive — a `$derived` behind the scenes, the same way `{count}` updates in the template. A bare `{const x = e}` is not: it behaves like a `const` in `<script>`, evaluated once. So a `{@const}` → `{const}` rename silently drops reactivity — no compile or type error, the UI just stops updating — until it's rewritten as `{const x = $derived(e)}`. The page never says this, and its only bare-`{const}` example is inside an `{#each}`. A bare `{const}` there is one-time too — recomputed when an item is created, not when an item's data mutates — but the example's array is static, so it can never go stale, which makes bare `{const}` look reactive when it isn't. A short note next to "use declaration tags instead" would cover it: | was | reactive equivalent | one-time | | ---------------- | ------------------------- | --------------- | | `{@const x = e}` | `{const x = $derived(e)}` | `{const x = e}` | ### Reproduction REPL: <https://svelte.dev/playground#H4sIAAAAAAAAA4WSUU6EMBCGr9JUHyAsoq9YyK56C_GhW2a1sTuQdmDdEBIP4Qk9iaFFSMwmvk2n__z950sHjvIIPOeSUtWgo7R3a1GD1T3UqcbUoW5bIL7hJLU5aax5fpDGwYYftAHH8-eB07mdvKYG3_w679r2xvVgaOrtpYNLfdUgAZLjORdOWd1SWWFFBoippkNiBbt2JAmi2_i-QpGtIhT7jqhB1qAyWr0XQxSzogxzSTKWGpWFIyCx78-v2U47hs2JDf40iixYeLvhat6VubfmFPXSdBCPU5ph68mwXssdPfqyYP6eJewuSBbFg7Twn-Yp8J2Wm1FHizQ8KTrjQVQkjC57LdmcITLwKtU5ztmwxhlFZvQf_V5aYH4mSJdcl8TBO1nihJE55jogMh9ryGZSo-e2tYA12IDNg512mH4MfBDPyXYwvow_Ln2kqHICAAA> Click _increment_ — `@const` and `$derived` track (showing `count + 1`), the bare `const` stays at `1`. It's not snippet-specific; the same holds anywhere. But both Claude and I lost hours and thousands of tokens before we figured this one uit ourselves. ```svelte <script> let count = $state(0); </script> <button onclick={() => count++}>increment — count is now {count}</button> {#snippet show(value)} {@const viaAtConst = value + 1} {const viaBareConst = value + 1} {const viaDerived = $derived(value + 1)} <ul> <li>via @const (legacy): {viaAtConst}</li> <li>via bare const: {viaBareConst}</li> <li>via const + $derived: {viaDerived}</li> </ul> {/snippet} {@render show(count)} ``` ### Logs ```shell N/A — compile-time/reactivity behaviour, no runtime error or console output. ``` ### System Info ```shell System: OS: macOS 15.7.7 CPU: (10) arm64 Apple M1 Pro Shell: 5.9 - /bin/zsh Binaries: Node: 24.14.0 npm: 11.9.0 pnpm: 11.5.0 Browsers: Chrome: 148.0.7778.179 Firefox: 150.0.3 Safari: 26.5 npmPackages: svelte: ^5.56.0 => 5.56.0 ``` ### Severity annoyance
关闭于 2026-06-01 2 条评论