Motivation

const in javascript:

The const declaration creates an immutable reference to a value.
It does not mean the value it holds is immutable — just that the variable identifier cannot be reassigned.
You should understand const declarations as "create a variable whose identity remains constant", not "whose value remains constant" — or, "create immutable bindings", not "immutable values".

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const

At the moment the Svelte 5 compiler breaks this rule and we can no longer make assumptions of what should be possible.

<script>
const { value } = $props() 

const copy = value;

console.log(value) // output: 1

function onclick() {
    console.log(value) // output: 3 (prop was updated)
    if (copy === value) { // false ?!?
    }
}
</script>

<button {onclick}>Click me</button>

Because the compiler replaces all usages of reactive values by getters & setters, this doesn't result in aTypeError: Assignment to constant variable. error like it would in regular javascript.

Description

The svelte/rune-prefer-let rule is aware of which variables are reactive by detecting switch are assigned via a rune.

eslint prefer-const rule doesn't see any reassignments so it assumes a let statement can be safely converted to const which conflicts with the svelte/rune-prefer-let

The svelte/prefer-const rule is identical, but takes into account which variable are reactive an can be reassigned.

Examples

<!-- ✓ GOOD -->
<script>
let {count,  onclick} = $props();

let double = $derived(count * 2);
</script>


<!-- ✗ BAD -->
<script>
const {count,  onclick} = $props();

const double = $derived(count * 2);
</script>

Additional comments

Implementation of these rules are available #806 & #816