diff --git a/documentation/docs/98-reference/.generated/client-errors.md b/documentation/docs/98-reference/.generated/client-errors.md index 2ab442afc3..1b01172d69 100644 --- a/documentation/docs/98-reference/.generated/client-errors.md +++ b/documentation/docs/98-reference/.generated/client-errors.md @@ -52,6 +52,35 @@ See the [migration guide](/docs/svelte/v5-migration-guide#Components-are-no-long A derived value cannot reference itself recursively ``` +This error occurs when a [`$derived`](/docs/svelte/$derived) value reads itself during its computation, either directly or indirectly. This creates a circular dependency. + +Often, this happens when trying to accumulate a value or preserve previous state, such as tracking a high score: + +```svelte + +``` + +To fix this, use a regular [`$state`](/docs/svelte/$state) variable and update it explicitly alongside the source state (for example, in an event handler): + +```svelte + +``` + +This error can also happen indirectly with circular component bindings, such as when a parent component computes a prop by reading a bound value from a child component that in turn depends on that prop. + ### each_key_duplicate ``` diff --git a/packages/svelte/messages/client-errors/errors.md b/packages/svelte/messages/client-errors/errors.md index 3b00d1516b..38485089f8 100644 --- a/packages/svelte/messages/client-errors/errors.md +++ b/packages/svelte/messages/client-errors/errors.md @@ -36,6 +36,35 @@ See the [migration guide](/docs/svelte/v5-migration-guide#Components-are-no-long > A derived value cannot reference itself recursively +This error occurs when a [`$derived`](/docs/svelte/$derived) value reads itself during its computation, either directly or indirectly. This creates a circular dependency. + +Often, this happens when trying to accumulate a value or preserve previous state, such as tracking a high score: + +```svelte + +``` + +To fix this, use a regular [`$state`](/docs/svelte/$state) variable and update it explicitly alongside the source state (for example, in an event handler): + +```svelte + +``` + +This error can also happen indirectly with circular component bindings, such as when a parent component computes a prop by reading a bound value from a child component that in turn depends on that prop. + ## each_key_duplicate > Keyed each block has duplicate key at indexes %a% and %b%