diff --git a/documentation/docs/98-reference/.generated/compile-warnings.md b/documentation/docs/98-reference/.generated/compile-warnings.md index b049a40fb9..cc948e2547 100644 --- a/documentation/docs/98-reference/.generated/compile-warnings.md +++ b/documentation/docs/98-reference/.generated/compile-warnings.md @@ -654,6 +654,12 @@ HTML restricts where certain elements can appear. In case of a violation the bro This code will work when the component is rendered on the client (which is why this is a warning rather than an error), but if you use server rendering it will cause hydration to fail. +### non_reactive_update + +``` +`%name%` is updated, but is not declared with `$state(...)`. Changing its value will not correctly trigger updates +``` + ### options_deprecated_accessors ``` diff --git a/packages/svelte/messages/compile-warnings/script.md b/packages/svelte/messages/compile-warnings/script.md index 20c535bd23..2c891b4fc7 100644 --- a/packages/svelte/messages/compile-warnings/script.md +++ b/packages/svelte/messages/compile-warnings/script.md @@ -6,6 +6,10 @@ > Svelte 5 components are no longer classes. Instantiate them using `mount` or `hydrate` (imported from 'svelte') instead. +## non_reactive_update + +> `%name%` is updated, but is not declared with `$state(...)`. Changing its value will not correctly trigger updates + ## perf_avoid_inline_class > Avoid 'new class' — instead, declare the class at the top level scope diff --git a/packages/svelte/src/compiler/warnings.js b/packages/svelte/src/compiler/warnings.js index 78ab2aeb3e..f6ed7de7d5 100644 --- a/packages/svelte/src/compiler/warnings.js +++ b/packages/svelte/src/compiler/warnings.js @@ -97,6 +97,7 @@ export const codes = [ "options_renamed_ssr_dom", "export_let_unused", "legacy_component_creation", + "non_reactive_update", "perf_avoid_inline_class", "perf_avoid_nested_class", "reactive_declaration_invalid_placement", @@ -598,6 +599,15 @@ export function legacy_component_creation(node) { w(node, "legacy_component_creation", "Svelte 5 components are no longer classes. Instantiate them using `mount` or `hydrate` (imported from 'svelte') instead."); } +/** + * `%name%` is updated, but is not declared with `$state(...)`. Changing its value will not correctly trigger updates + * @param {null | NodeLike} node + * @param {string} name + */ +export function non_reactive_update(node, name) { + w(node, "non_reactive_update", `\`${name}\` is updated, but is not declared with \`$state(...)\`. Changing its value will not correctly trigger updates`); +} + /** * Avoid 'new class' — instead, declare the class at the top level scope * @param {null | NodeLike} node