* start reorganising messages
* tidy up
* more
* more
* more
* alphabetise
* consolidate
* more
* more
* more
* more
* more
* more
* alphabetise
* more
* this is no longer needed
* no longer necessary
* more
* more
* fix
* regenerate messages
* more
* more
* tighten up rune validation
* more
* fix
* more
* tweak a11y messages
* add server errors
* overhaul runtime errors
* regenerate messages
* unused
* lint
* more
* more
* Update packages/svelte/messages/compile-errors/script.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* Update packages/svelte/messages/client-warnings/warnings.md
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
* fix
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
> Maximum update depth exceeded. This can happen when a reactive block or effect repeatedly sets a new value. Svelte limits the number of nested updates to prevent infinite loops
> Using `bind:value` together with a checkbox input is not allowed. Use `bind:checked` instead
## bind_invalid_export
> Component %component% has an export named `%key%` that a consumer component is trying to access using `bind:%key%`, which is disallowed. Instead, use `bind:this` (e.g. `<%name% bind:this={component} />`) and then access the property on the bound component instance (e.g. `component.%key%`)
## bind_not_bindable
> A component is attempting to bind to a non-bindable property `%key%` belonging to %component% (i.e. `<%name% bind:%key%={...}>`). To mark a property as bindable: `let { %key% = $bindable() } = $props()`
## each_key_duplicate
> Keyed each block has duplicate key at indexes %a% and %b%
> Keyed each block has duplicate key `%value%` at indexes %a% and %b%
## effect_in_teardown
> `%rune%` cannot be used inside an effect cleanup function
## effect_orphan
> `%rune%` can only be used inside an effect (e.g. during component initialisation)
## effect_update_depth_exceeded
> Maximum update depth exceeded. This can happen when a reactive block or effect repeatedly sets a new value. Svelte limits the number of nested updates to prevent infinite loops
## hydration_missing_marker_close
> Missing hydration closing marker
## hydration_missing_marker_open
> Missing hydration opening marker
## lifecycle_legacy_only
> `%name%(...)` cannot be used in runes mode
## props_invalid_value
> Cannot do `bind:%key%={undefined}` when `%key%` has a fallback value
## props_rest_readonly
> Rest element properties of `$props()` such as `%property%` are readonly
## rune_outside_svelte
> The `%rune%` rune is only available inside `.svelte` and `.svelte.js/ts` files
## state_prototype_fixed
> Cannot set prototype of `$state` object
## state_unsafe_mutation
> Unsafe mutations during Svelte's render or derived phase are not permitted in runes mode. This can lead to unexpected errors and possibly cause infinite loops.
>
> If the object is not meant to be reactive, declare it without `$state`
## svelte_component_invalid_this_value
> The `this={...}` property of a `<svelte:component>` must be a Svelte component, if defined
> The `%attribute%` attribute on `%html%` changed its value between server and client renders. The client value, `%value%`, will be ignored in favour of the server value
## hydration_mismatch
> Hydration failed because the initial UI does not match what was rendered on the server
## lifecycle_double_unmount
> Tried to unmount a component that was not mounted
> `$:` is not allowed in runes mode, use `$derived` or `$effect` instead
## invalid_legacy_export
> Cannot use `export let` in runes mode — use $props instead
## invalid_rune_usage
> Cannot use %rune% rune in non-runes mode
## invalid_state_export
> Cannot export state from a module if it is reassigned. Either export a function returning the state value or only mutate the state value's properties
## invalid_derived_export
> Cannot export derived state from a module. To expose the current derived value, export a function returning its value
## invalid_props_id
> `$props()` can only be used with an object destructuring pattern
## invalid_props_pattern
> `$props()` assignment must not contain nested properties or computed keys
## invalid_props_location
> `$props()` can only be used at the top level of components as a variable declaration initializer
## invalid_bindable_location
> `$bindable()` can only be used inside a `$props()` declaration
## invalid_state_location
> `%rune%(...)` can only be used as a variable declaration initializer or a class field
## invalid_effect_location
> `$effect()` can only be used as an expression statement
## invalid_host_location
> `$host()` can only be used inside custom element component instances
## invalid_assignment
> Cannot assign to %thing%
## invalid_binding
> Cannot bind to %thing%
## invalid_rune_args
> `%rune%` cannot be called with arguments
## invalid_rune_args_length
> `%rune%` must be called with %args%
## invalid_runes_mode_import
> %name% cannot be used in runes mode
## duplicate_props_rune
> Cannot use `$props()` more than once
## invalid_each_assignment
> Cannot reassign or bind to each block argument in runes mode. Use the array and index variables instead (e.g. `array[i] = value` instead of `entry = value`)
## invalid_snippet_assignment
> Cannot reassign or bind to snippet parameter
## invalid_derived_call
> `$derived.call(...)` has been replaced with `$derived.by(...)`
## conflicting_property_name
> Cannot have a property and a component export with the same name
> `$bindable()` can only be used inside a `$props()` declaration
## constant_assignment
> Cannot assign to %thing%
## constant_binding
> Cannot bind to %thing%
## declaration_duplicate
> `%name%` has already been declared
## declaration_duplicate_module_import
> Cannot declare same variable name which is imported inside `<script context="module">`
## derived_invalid_export
> Cannot export derived state from a module. To expose the current derived value, export a function returning its value
## dollar_binding_invalid
> The $ name is reserved, and cannot be used for variables and imports
## dollar_prefix_invalid
> The $ prefix is reserved, and cannot be used for variables and imports
## each_item_invalid_assignment
> Cannot reassign or bind to each block argument in runes mode. Use the array and index variables instead (e.g. `array[i] = value` instead of `entry = value`)
## effect_invalid_placement
> `$effect()` can only be used as an expression statement
## global_reference_invalid
> `%name%` is an illegal variable name. To reference a global variable called `%name%`, use `globalThis.%name%`
## host_invalid_placement
> `$host()` can only be used inside custom element component instances
## legacy_export_invalid
> Cannot use `export let` in runes mode — use `$props()` instead
## legacy_props_invalid
> Cannot use `$$props` in runes mode
## legacy_reactive_statement_invalid
> `$:` is not allowed in runes mode, use `$derived` or `$effect` instead
## legacy_rest_props_invalid
> Cannot use `$$restProps` in runes mode
## module_illegal_default_export
> A component cannot have a default export
## props_duplicate
> Cannot use `$props()` more than once
## props_invalid_identifier
> `$props()` can only be used with an object destructuring pattern
## props_invalid_pattern
> `$props()` assignment must not contain nested properties or computed keys
## props_invalid_placement
> `$props()` can only be used at the top level of components as a variable declaration initializer
## reactive_declaration_cycle
> Cyclical dependency detected: %cycle%
## rune_invalid_arguments
> `%rune%` cannot be called with arguments
## rune_invalid_arguments_length
> `%rune%` must be called with %args%
## rune_invalid_computed_property
> Cannot access a computed property of a rune
## rune_invalid_name
> `%name%` is not a valid rune
## rune_invalid_usage
> Cannot use `%rune%` rune in non-runes mode
## rune_missing_parentheses
> Cannot use rune without parentheses
## runes_mode_invalid_import
> %name% cannot be used in runes mode
## snippet_parameter_assignment
> Cannot reassign or bind to snippet parameter
## state_invalid_export
> Cannot export state from a module if it is reassigned. Either export a function returning the state value or only mutate the state value's properties
## state_invalid_placement
> `%rune%(...)` can only be used as a variable declaration initializer or a class field
## store_invalid_scoped_subscription
> Cannot subscribe to stores that are not declared at the top level of the component
## store_invalid_subscription
> Cannot reference store value inside `<script context="module">`
> `<slot>` can only receive attributes and (optionally) let directives
## invalid_slot_attribute
> slot attribute must be a static value
## invalid_slot_name_default
> `default` is a reserved word — it cannot be used as a slot name
## invalid_slot_name
> slot attribute must be a static value
## invalid_slot_placement
> Element with a slot='...' attribute must be a child of a component or a descendant of a custom element
## duplicate_slot_name
> Duplicate slot name '%name%' in <%component%>
## invalid_default_slot_content
> Found default slot content alongside an explicit slot="default"
## conflicting_children_snippet
> Cannot use explicit children snippet at the same time as implicit children content. Remove either the non-whitespace content or the children snippet block
> `<svelte:options>` can only receive static attributes
## invalid_svelte_option_namespace
> Unsupported `<svelte:option>` value for "namespace". Valid values are "html", "svg" or "foreign"
## tag_option_deprecated
> "tag" option is deprecated — use "customElement" instead
## invalid_svelte_option_runes
> Unsupported `<svelte:option>` value for "runes". Valid values are true or false
## invalid_svelte_option_accessors
> Unsupported `<svelte:option>` value for "accessors". Valid values are true or false
## invalid_svelte_option_preserveWhitespace
> Unsupported `<svelte:option>` value for "preserveWhitespace". Valid values are true or false
## invalid_svelte_option_immutable
> Unsupported `<svelte:option>` value for "immutable". Valid values are true or false
## invalid_tag_property
> Tag name must be two or more words joined by the "-" character
## invalid_svelte_option_customElement
> "customElement" must be a string literal defining a valid custom element name or an object of the form { tag: string; shadow?: "open" | "none"; props?: { [key: string]: { attribute?: string; reflect?: boolean; type: .. } } }
## invalid_customElement_props_attribute
> "props" must be a statically analyzable object literal of the form "{ [key: string]: { attribute?: string; reflect?: boolean; type?: "String" | "Boolean" | "Number" | "Array" | "Object" }"
## invalid_customElement_shadow_attribute
> "shadow" must be either "open" or "none"
## unknown_svelte_option_attribute
> `<svelte:options>` unknown attribute '%name%'
## illegal_svelte_head_attribute
> `<svelte:head>` cannot have attributes nor directives
## invalid_svelte_fragment_attribute
> `<svelte:fragment>` can only have a slot attribute and (optionally) a let: directive
## invalid_svelte_fragment_slot
> `<svelte:fragment>` slot attribute must have a static value
## invalid_svelte_fragment_placement
> `<svelte:fragment>` must be the direct child of a component
## invalid_svelte_element_placement
> <%name%> tags cannot be inside elements or blocks
## duplicate_svelte_element
> A component can only have one <%name%> element
## invalid_self_placement
> `<svelte:self>` components can only exist inside {#if} blocks, {#each} blocks, {#snippet} blocks or slots passed to components
## missing_svelte_element_definition
> `<svelte:element>` must have a 'this' attribute
## missing_svelte_component_definition
> `<svelte:component>` must have a 'this' attribute
## invalid_svelte_element_definition
> Invalid element definition — must be an {expression}
## invalid_svelte_component_definition
> Invalid component definition — must be an {expression}
## invalid_svelte_tag
> Valid `<svelte:...>` tag names are %list%
## conflicting_slot_usage
> Cannot use `<slot>` syntax and `{@render ...}` tags in the same component. Migrate towards `{@render ...}` tags completely.
> An element can only have one 'animate' directive
## animation_invalid_placement
> An element that uses the `animate:` directive must be the only child of a keyed `{#each ...}` block
## animation_missing_key
> An element that uses the `animate:` directive must be the only child of a keyed `{#each ...}` block. Did you forget to add a key to your each block?
## attribute_contenteditable_dynamic
> 'contenteditable' attribute cannot be dynamic if element uses two-way binding
## attribute_contenteditable_missing
> 'contenteditable' attribute is required for textContent, innerHTML and innerText two-way bindings
## attribute_duplicate
> Attributes need to be unique
## attribute_empty_shorthand
> Attribute shorthand cannot be empty
## attribute_invalid_event_handler
> Event attribute must be a JavaScript expression, not a string
## attribute_invalid_multiple
> 'multiple' attribute must be static if select uses two-way binding
## attribute_invalid_name
> '%name%' is not a valid attribute name
## attribute_invalid_sequence_expression
> Sequence expressions are not allowed as attribute/directive values in runes mode, unless wrapped in parentheses
## attribute_invalid_type
> 'type' attribute must be a static text value if input uses two-way binding
## bind_invalid_expression
> Can only bind to an Identifier or MemberExpression
## bind_invalid_name
> `bind:%name%` is not a valid binding
> `bind:%name%` is not a valid binding. %explanation%
## bind_invalid_target
> `bind:%name%` can only be used with %elements%
## bind_invalid_value
> Can only bind to state or props
## block_duplicate_clause
> %name% cannot appear more than once within a block
## block_invalid_continuation_placement
> {:...} block is invalid at this position (did you forget to close the preceeding element or block?)
## block_invalid_elseif
> 'elseif' should be 'else if'
## block_invalid_placement
> {#%name% ...} block cannot be %location%
## block_unclosed
> Block was left open
## block_unexpected_close
> Unexpected block closing tag
## component_invalid_directive
> This type of directive is not valid on components
## const_tag_invalid_expression
> {@const ...} must be an assignment
## const_tag_invalid_placement
> `{@const}` must be the immediate child of `{#snippet}`, `{#if}`, `{:else if}`, `{:else}`, `{#each}`, `{:then}`, `{:catch}`, `<svelte:fragment>` or `<Component>`
## debug_tag_invalid_arguments
> {@debug ...} arguments must be identifiers, not arbitrary expressions
## directive_invalid_value
> Directive value must be a JavaScript expression enclosed in curly braces
## directive_missing_name
> `%type%` name cannot be empty
## element_invalid_closing_tag
> `</%name%>` attempted to close an element that was not open
## element_invalid_closing_tag_autoclosed
> `</%name%>` attempted to close element that was already automatically closed by `<%reason%>` (cannot nest `<%reason%>` inside `<%name%>`)
## element_invalid_tag_name
> Expected valid tag name
## element_unclosed
> `<%name%>` was left open
## event_handler_invalid_component_modifier
> Event modifiers other than 'once' can only be used on DOM elements
## event_handler_invalid_modifier
> Valid event modifiers are %list%
## event_handler_invalid_modifier_combination
> The '%modifier1%' and '%modifier2%' modifiers cannot be used together
## expected_attribute_value
> Expected attribute value
## expected_block_type
> Expected 'if', 'each', 'await', 'key' or 'snippet'
## expected_identifier
> Expected an identifier
## expected_pattern
> Expected identifier or destructure pattern
## expected_token
> Expected token %token%
## expected_whitespace
> Expected whitespace
## js_parse_error
> %message%
## let_directive_invalid_placement
> `let:` directive at invalid position
## node_invalid_placement
> %thing% is invalid inside <%parent%>
## render_tag_invalid_call_expression
> Calling a snippet function using apply, bind or call is not allowed
## render_tag_invalid_expression
> `{@render ...}` tags can only contain call expressions
## render_tag_invalid_spread_argument
> cannot use spread arguments in `{@render ...}` tags
## script_duplicate
> A component can have a single top-level `<script>` element and/or a single top-level `<script context="module">` element
## script_invalid_context
> If the context attribute is supplied, its value must be "module"
## slot_attribute_duplicate
> Duplicate slot name '%name%' in <%component%>
## slot_attribute_invalid
> slot attribute must be a static value
## slot_attribute_invalid_placement
> Element with a slot='...' attribute must be a child of a component or a descendant of a custom element
## slot_default_duplicate
> Found default slot content alongside an explicit slot="default"
## slot_element_invalid_attribute
> `<slot>` can only receive attributes and (optionally) let directives
## slot_element_invalid_name
> slot attribute must be a static value
## slot_element_invalid_name_default
> `default` is a reserved word — it cannot be used as a slot name
## slot_snippet_conflict
> Cannot use `<slot>` syntax and `{@render ...}` tags in the same component. Migrate towards `{@render ...}` tags completely.
## snippet_conflict
> Cannot use explicit children snippet at the same time as implicit children content. Remove either the non-whitespace content or the children snippet block
## snippet_invalid_rest_parameter
> snippets do not support rest parameters; use an array instead
## style_directive_invalid_modifier
> `style:` directive can only use the `important` modifier
## style_duplicate
> A component can have a single top-level `<style>` element
## svelte_component_invalid_this
> Invalid component definition — must be an `{expression}`
## svelte_component_missing_this
> `<svelte:component>` must have a 'this' attribute
## svelte_element_invalid_this
> Invalid element definition — must be an `{expression}`
## svelte_element_missing_this
> `<svelte:element>` must have a 'this' attribute
## svelte_fragment_invalid_attribute
> `<svelte:fragment>` can only have a slot attribute and (optionally) a let: directive
## svelte_fragment_invalid_placement
> `<svelte:fragment>` must be the direct child of a component
## svelte_fragment_invalid_slot
> `<svelte:fragment>` slot attribute must have a static value
## svelte_head_illegal_attribute
> `<svelte:head>` cannot have attributes nor directives
## svelte_meta_duplicate
> A component can only have one `<%name%>` element
## svelte_meta_invalid_content
> <%name%> cannot have children
## svelte_meta_invalid_placement
> `<%name%>` tags cannot be inside elements or blocks
## svelte_meta_invalid_tag
> Valid `<svelte:...>` tag names are %list%
## svelte_options_deprecated_tag
> "tag" option is deprecated — use "customElement" instead
## svelte_options_invalid_attribute
> `<svelte:options>` can only receive static attributes
## svelte_options_invalid_attribute_value
> Valid values are %list%
## svelte_options_invalid_customelement
> "customElement" must be a string literal defining a valid custom element name or an object of the form { tag: string; shadow?: "open" | "none"; props?: { [key: string]: { attribute?: string; reflect?: boolean; type: .. } } }
## svelte_options_invalid_customelement_props
> "props" must be a statically analyzable object literal of the form "{ [key: string]: { attribute?: string; reflect?: boolean; type?: "String" | "Boolean" | "Number" | "Array" | "Object" }"
## svelte_options_invalid_customelement_shadow
> "shadow" must be either "open" or "none"
## svelte_options_invalid_tagname
> Tag name must be two or more words joined by the "-" character
## svelte_options_unknown_attribute
> `<svelte:options>` unknown attribute '%name%'
## svelte_self_invalid_placement
> `<svelte:self>` components can only exist inside `{#if}` blocks, `{#each}` blocks, `{#snippet}` blocks or slots passed to components
## tag_invalid_placement
> {@%name% ...} tag cannot be %location%
## textarea_invalid_content
> A `<textarea>` can have either a value attribute or (equivalently) child content, but not both
## title_illegal_attribute
> `<title>` cannot have attributes nor directives
## title_invalid_content
> `<title>` can only contain text and {tags}
## transition_conflict
> Cannot use `%type%:` alongside existing `%existing%:` directive
## transition_duplicate
> Cannot use multiple `%type%:` directives on a single element
## unexpected_eof
> Unexpected end of input
## unexpected_reserved_word
> '%word%' is a reserved word in JavaScript and cannot be used here
## void_element_invalid_content
> Void elements cannot have children or closing tags
> An element with an aria-activedescendant attribute should have a tabindex value
> Unknown aria attribute 'aria-%attribute%'. Did you mean '%suggestion%'?
## a11y_aria_attributes
## a11y_hidden
> `<%name%>` should not have aria-* attributes
> <%name%> element should not be hidden
## a11y_autocomplete_valid
## a11y_incorrect_aria_attribute_type_boolean
> '%value%' is an invalid value for 'autocomplete' on `<input type="%type%">`
> The value of '%attribute%' must be either 'true' or 'false'
## a11y_autofocus
## a11y_incorrect_aria_attribute_type_integer
> Avoid using autofocus
> The value of '%attribute%' must be an integer
## a11y_click_events_have_key_events
## a11y_incorrect_aria_attribute_type_id
> Visible, non-interactive elements with a click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as `<button type="button">` or `<a>` might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.
> The value of '%attribute%' must be a string that represents a DOM element ID
## a11y_distracting_elements
## a11y_incorrect_aria_attribute_type_idlist
> Avoid `<%name%>` elements
> The value of '%attribute%' must be a space-separated list of strings that represent DOM element IDs
## a11y_figcaption_index
## a11y_incorrect_aria_attribute_type_tristate
> `<figcaption>` must be first or last child of `<figure>`
> The value of '%attribute%' must be exactly one of true, false, or mixed
## a11y_figcaption_parent
## a11y_incorrect_aria_attribute_type_token
> `<figcaption>` must be an immediate child of `<figure>`
> The value of '%attribute%' must be exactly one of %values%
## a11y_hidden
## a11y_incorrect_aria_attribute_type_tokenlist
> `<%name%>` element should not be hidden
> The value of '%attribute%' must be a space-separated list of one or more of %values%
## a11y_img_redundant_alt
> Screenreaders already announce `<img>` elements as an image.
## a11y_incorrect_aria_attribute_type
> The value of '%attribute%' must be of type %type%
## a11y_aria_activedescendant_has_tabindex
## a11y_incorrect_aria_attribute_type_boolean
> Elements with attribute aria-activedescendant should have tabindex value
> The value of '%attribute%' must be either 'true' or 'false'
## a11y_misplaced_role
## a11y_incorrect_aria_attribute_type_id
> <%name%> should not have role attribute
> The value of '%attribute%' must be a string that represents a DOM element ID
## a11y_no_abstract_role
## a11y_incorrect_aria_attribute_type_idlist
> Abstract role '%role%' is forbidden
> The value of '%attribute%' must be a space-separated list of strings that represent DOM element IDs
## a11y_unknown_role
## a11y_incorrect_aria_attribute_type_integer
> Unknown role '%role%'
> The value of '%attribute%' must be an integer
> Unknown role '%role%'. Did you mean '%suggestion%'?
## a11y_incorrect_aria_attribute_type_token
## a11y_no_redundant_roles
> The value of '%attribute%' must be exactly one of %values%
> Redundant role '%role%'
## a11y_incorrect_aria_attribute_type_tokenlist
## a11y_role_has_required_aria_props
> The value of '%attribute%' must be a space-separated list of one or more of %values%
> Elements with the ARIA role "%role%" must have the following attributes defined: %props%
## a11y_incorrect_aria_attribute_type_tristate
> The value of '%attribute%' must be exactly one of true, false, or mixed
## a11y_interactive_supports_focus
> Elements with the '%role%' interactive role must have a tabindex value.
> Non-interactive element <%element%> cannot have interactive role '%role%'
> A form label must be associated with a control.
## a11y_accesskey
## a11y_media_has_caption
> Avoid using accesskey
> `<video>` elements must have a `<track kind="captions">`
## a11y_autofocus
## a11y_misplaced_role
> Avoid using autofocus
> `<%name%>` should not have role attribute
## a11y_misplaced_scope
> The scope attribute should only be used with <th> elements
> The scope attribute should only be used with `<th>` elements
## a11y_positive_tabindex
## a11y_missing_attribute
> Avoid tabindex values above zero
> `<%name%>` element should have %article% %sequence% attribute
## a11y_click_events_have_key_events
## a11y_missing_content
> Visible, non-interactive elements with a click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as <buttontype="button"> or <a> might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.
> `<%name%>` element should have child content
## a11y_no_noninteractive_tabindex
## a11y_mouse_events_have_key_events
> noninteractive element cannot have nonnegative tabIndex value
> '%event%' event must be accompanied by '%accompanied_by%' event
## a11y_role_supports_aria_props
## a11y_no_abstract_role
> The attribute '%attribute%' is not supported by the role '%role%'
> It looks like you're using the `$%name%` rune, but there is a local binding called `%name%`. Referencing a local variable with a `$` prefix will create a store subscription. Please rename `%name%` to avoid the ambiguity
## non_state_reference
> `%name%` is updated, but is not declared with `$state(...)`. Changing its value will not correctly trigger updates
## derived_iife
> Use `$derived.by(() => {...})` instead of `$derived((() => {...})())`
## invalid_props_declaration
> Component properties are declared using `$props()` in runes mode. Did you forget to call the function?
## invalid_bindable_declaration
> Bindable component properties are declared using `$bindable()` in runes mode. Did you forget to call the function?
> Use `$derived.by(() => {...})` instead of `$derived((() => {...})())`
## export_let_unused
> Component has unused export property '%name%'. If it is for external reference only, please consider using `export const %name%`
## 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
## perf_avoid_nested_class
> Avoid declaring classes below the top level scope
## reactive_declaration_invalid_placement
> Reactive declarations only exist at the top level of the instance script
## reactive_declaration_module_script
> All dependencies of the reactive declaration are declared in a module script and will not be reactive
## state_referenced_locally
> State referenced in its own scope will never update. Did you mean to reference it inside a closure?
## store_rune_conflict
> It looks like you're using the `$%name%` rune, but there is a local binding called `%name%`. Referencing a local variable with a `$` prefix will create a store subscription. Please rename `%name%` to avoid the ambiguity
> `%name%(...)` can only be used during component initialisation
## render_tag_invalid_argument
> The argument to `{@render ...}` must be a snippet function, not a component or some other kind of function. If you want to dynamically render one snippet or another, use `$derived` and pass its result to `{@render ...}`
## snippet_used_as_component
> A snippet must be rendered with `{@render ...}`
## store_invalid_shape
> `%name%` is not a store with a `subscribe` method
## svelte_element_invalid_this_value
> The `this` prop on `<svelte:element>` must be a string, if defined
w(node,"a11y_unknown_aria_attribute",suggestion?`Unknown aria attribute 'aria-${attribute}'. Did you mean '${suggestion}'?`:`Unknown aria attribute 'aria-${attribute}'`);
*Visible,non-interactiveelementswithaclickeventmustbeaccompaniedbyakeyboardeventhandler.Considerwhetheraninteractiveelementsuchas`<button type="button">`or`<a>`mightbemoreappropriate.Seehttps://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.
w(node,"a11y_click_events_have_key_events","Visible, non-interactive elements with a click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as `<button type=\"button\">` or `<a>` might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.");
w(node,"a11y_incorrect_aria_attribute_type_idlist",`The value of '${attribute}' must be a space-separated list of strings that represent DOM element IDs`);
w(node,"a11y_incorrect_aria_attribute_type_idlist",`The value of '${attribute}' must be a space-separated list of strings that represent DOM element IDs`);
w(node,"a11y_missing_attribute",`\`<${name}>\` element should have ${article}${sequence} attribute`);
}
/**
*Visible,non-interactiveelementswithaclickeventmustbeaccompaniedbyakeyboardeventhandler.Considerwhetheraninteractiveelementsuchas<buttontype="button">or<a>mightbemoreappropriate.Seehttps://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.
w(node,"a11y_click_events_have_key_events","Visible, non-interactive elements with a click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as <button type=\"button\"> or <a> might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.");
exportfunctiona11y_missing_content(node,name){
w(node,"a11y_missing_content",`\`<${name}>\` element should have child content`);
w(node,"a11y_role_supports_aria_props_implicit",`The attribute '${attribute}' is not supported by the role '${role}'. This role is implicit on the element <${name}>`);
w(node,"a11y_no_noninteractive_element_interactions",`Non-interactive element <${element}> should not be assigned mouse or keyboard event listeners.`);
w(node,"a11y_no_noninteractive_element_interactions",`Non-interactive element \`<${element}>\` should not be assigned mouse or keyboard event listeners.`);
w(node,"a11y_role_supports_aria_props_implicit",`The attribute '${attribute}' is not supported by the role '${role}'. This role is implicit on the element \`<${name}>\``);
w(node,"a11y_unknown_aria_attribute",suggestion?`Unknown aria attribute 'aria-${attribute}'. Did you mean '${suggestion}'?`:`Unknown aria attribute 'aria-${attribute}'`);
}
/**
*<%name%>elementshouldhavechildcontent
*Unknownrole'%role%'.Didyoumean'%suggestion%'?
*@param{null|NodeLike}node
*@param{string}name
*@param{string}role
*@param{string|undefined|null}[suggestion]
*/
exportfunctiona11y_missing_content(node,name){
w(node,"a11y_missing_content",`<${name}> element should have child content`);
w(node,"options_missing_custom_element","The `customElement` option is used when generating a custom element. Did you forget the `customElement: true` compile option?");
w(node,"options_removed_enable_sourcemap","The `enableSourcemap` option has been removed. Source maps are always generated now, and tooling can choose to ignore them");
w(node,"module_script_reactive_declaration","All dependencies of the reactive declaration are declared in a module script and will not be reactive");
exportfunctionderived_iife(node){
w(node,"derived_iife","Use `$derived.by(() => {...})` instead of `$derived((() => {...})())`");
}
/**
@ -496,163 +483,160 @@ export function module_script_reactive_declaration(node) {
*@param{null|NodeLike}node
*@param{string}name
*/
exportfunctionunused_export_let(node,name){
w(node,"unused_export_let",`Component has unused export property '${name}'. If it is for external reference only, please consider using \`export const ${name}\``);
exportfunction export_let_unused(node,name){
w(node,"export_let_unused",`Component has unused export property '${name}'. If it is for external reference only, please consider using \`export const ${name}\``);
w(node,"deprecated_event_handler",`Using on:${name} to listen to the ${name} event is is deprecated. Use the event attribute on${name} instead.`);
exportfunctionnon_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`);
}
/**
*Self-closingHTMLtagsfornon-voidelementsareambiguous—use<%name%...></%name%> rather than <%name% ... />
w(node,"invalid_self_closing_tag",`Self-closing HTML tags for non-void elements are ambiguous — use <${name} ...></${name}> rather than <${name} ... />`);
exportfunctionperf_avoid_inline_class(node){
w(node,"perf_avoid_inline_class","Avoid 'new class' — instead, declare the class at the top level scope");
w(node,"options_missing_custom_element","The `customElement` option is used when generating a custom element. Did you forget the `customElement: true` compile option?");
w(node,"options_removed_enable_sourcemap","The `enableSourcemap` option has been removed. Source maps are always generated now, and tooling can choose to ignore them");
exportfunctionstore_rune_conflict(node,name){
w(node,"store_rune_conflict",`It looks like you're using the \`$${name}\` rune, but there is a local binding called \`${name}\`. Referencing a local variable with a \`$\` prefix will create a store subscription. Please rename \`${name}\` to avoid the ambiguity`);
w(node,"store_with_rune_name",`It looks like you're using the \`$${name}\` rune, but there is a local binding called \`${name}\`. Referencing a local variable with a \`$\` prefix will create a store subscription. Please rename \`${name}\` to avoid the ambiguity`);
w(node,"non_state_reference",`\`${name}\` is updated, but is not declared with \`$state(...)\`. Changing its value will not correctly trigger updates`);
exportfunctionbind_invalid_each_rest(node,name){
w(node,"bind_invalid_each_rest",`The rest operator (...) will create a new object and binding '${name}' with the original object will not work`);
w(node,"invalid_bindable_declaration","Bindable component properties are declared using `$bindable()` in runes mode. Did you forget to call the function?");
w(node,"element_invalid_self_closing_tag",`Self-closing HTML tags for non-void elements are ambiguous — use \`<${name} ...></${name}>\` rather than \`<${name} ... />\``);
w(node,"event_directive_deprecated",`Using \`on:${name}\` to listen to the ${name} event is deprecated. Use the event attribute \`on${name}\` instead.`);
w(node,"invalid_rest_eachblock_binding",`The rest operator (...) will create a new object and binding '${name}' with the original object will not work`);
exportfunctionslot_element_deprecated(node){
w(node,"slot_element_deprecated","Using `<slot>` to render parent content is deprecated. Use `{@render ...}` tags instead.");
consterror=newError(`${"bind_invalid_checkbox_value"}\n${"Using `bind:value` together with a checkbox input is not allowed. Use `bind:checked` instead"}`);
consterror=newError(`${"bind_invalid_export"}\n${`Component ${component} has an export named \`${key}\` that a consumer component is trying to access using \`bind:${key}\`, which is disallowed. Instead, use \`bind:this\` (e.g. \`<${name} bind:this={component} />\`) and then access the property on the bound component instance (e.g. \`component.${key}\`)`}`);
consterror=newError(`${"bind_not_bindable"}\n${`A component is attempting to bind to a non-bindable property \`${key}\` belonging to ${component} (i.e. \`<${name} bind:${key}={...}>\`). To mark a property as bindable: \`let { ${key} = $bindable() } = $props()\``}`);
consterror=newError(`${"each_key_duplicate"}\n${value?`Keyed each block has duplicate key \`${value}\` at indexes ${a} and ${b}`:`Keyed each block has duplicate key at indexes ${a} and ${b}`}`);
consterror=newError(`${"state_unsafe_mutation"}\n${"Unsafe mutations during Svelte's render or derived phase are not permitted in runes mode. This can lead to unexpected errors and possibly cause infinite loops.\n>\nIf the object is not meant to be reactive, declare it without `$state`"}`);
consterror=newError(`${"svelte_component_invalid_this_value"}\n${"The `this={...}` property of a `<svelte:component>` must be a Svelte component, if defined"}`);
`A component is binding to property ${key} of ${name}.svelte (i.e. <${name} bind:${key} />). This is disallowed because the property was not declared as bindable inside ${component.filename}. `+
`To mark a property as bindable, use the $bindable() rune in ${name}.svelte like this: \`let { ${key} = $bindable() } = $props()\``
console.warn(`%c[svelte] ${"hydration_attribute_changed"}\n%c${`The \`${attribute}\` attribute on \`${html}\` changed its value between server and client renders. The client value, \`${value}\`, will be ignored in favour of the server value`}`,bold,normal);
console.warn(`%c[svelte] ${"hydration_mismatch"}\n%c${"Hydration failed because the initial UI does not match what was rendered on the server"}`,bold,normal);
consterror=newError(`${"render_tag_invalid_argument"}\n${"The argument to `{@render ...}` must be a snippet function, not a component or some other kind of function. If you want to dynamically render one snippet or another, use `$derived` and pass its result to `{@render ...}`"}`);
error.name='Svelte error';
throwerror;
}else{
// TODO print a link to the documentation
thrownewError("render_tag_invalid_argument");
}
}
/**
*Asnippetmustberenderedwith`{@render ...}`
*@returns{never}
*/
exportfunctionsnippet_used_as_component(){
if(DEV){
consterror=newError(`${"snippet_used_as_component"}\n${"A snippet must be rendered with `{@render ...}`"}`);
error.name='Svelte error';
throwerror;
}else{
// TODO print a link to the documentation
thrownewError("snippet_used_as_component");
}
}
/**
*`%name%`isnotastorewitha`subscribe`method
*@param{string}name
*@returns{never}
*/
exportfunctionstore_invalid_shape(name){
if(DEV){
consterror=newError(`${"store_invalid_shape"}\n${`\`${name}\` is not a store with a \`subscribe\` method`}`);
Rich Harris
2 months ago
committed by
GitHub