Docs: clarify that bare `{const}` is not reactive, unlike the `{@const}` it replaces
### 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 条评论