mirror of https://github.com/sveltejs/svelte
Ideally each warning has accompanying details so that it doesn't look so empty on the final site, but that can happen separatelypull/13557/head
parent
531ff6243c
commit
1cd357c62d
@ -0,0 +1,952 @@
|
|||||||
|
---
|
||||||
|
title: 'Compiler Errors'
|
||||||
|
generated: 'generated by process-messages/index.js'
|
||||||
|
---
|
||||||
|
|
||||||
|
## options_invalid_value
|
||||||
|
|
||||||
|
```
|
||||||
|
Invalid compiler option: %details%
|
||||||
|
```
|
||||||
|
|
||||||
|
## options_removed
|
||||||
|
|
||||||
|
```
|
||||||
|
Invalid compiler option: %details%
|
||||||
|
```
|
||||||
|
|
||||||
|
## options_unrecognised
|
||||||
|
|
||||||
|
```
|
||||||
|
Unrecognised compiler option %keypath%
|
||||||
|
```
|
||||||
|
|
||||||
|
## bindable_invalid_location
|
||||||
|
|
||||||
|
```
|
||||||
|
`$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 a variable with the same name as an import inside `<script 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
|
||||||
|
```
|
||||||
|
|
||||||
|
## import_svelte_internal_forbidden
|
||||||
|
|
||||||
|
```
|
||||||
|
Imports of `svelte/internal/*` are forbidden. It contains private runtime code which is subject to change without notice. If you're importing from `svelte/internal/*` to work around a limitation of Svelte, please open an issue at https://github.com/sveltejs/svelte and explain your use case
|
||||||
|
```
|
||||||
|
|
||||||
|
## invalid_arguments_usage
|
||||||
|
|
||||||
|
```
|
||||||
|
The arguments keyword cannot be used within the template or at the top level of a component
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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_illegal_name
|
||||||
|
|
||||||
|
```
|
||||||
|
Declaring or accessing a prop starting with `$$` is illegal (they are reserved for Svelte internals)
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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
|
||||||
|
```
|
||||||
|
|
||||||
|
## rune_removed
|
||||||
|
|
||||||
|
```
|
||||||
|
The `%name%` rune has been removed
|
||||||
|
```
|
||||||
|
|
||||||
|
## rune_renamed
|
||||||
|
|
||||||
|
```
|
||||||
|
`%name%` is now `%replacement%`
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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 module>`
|
||||||
|
```
|
||||||
|
|
||||||
|
## store_invalid_subscription_module
|
||||||
|
|
||||||
|
```
|
||||||
|
Cannot reference store value outside a `.svelte` file
|
||||||
|
```
|
||||||
|
|
||||||
|
Using a `$` prefix to refer to the value of a store is only possible inside `.svelte` files, where Svelte can automatically create subscriptions when a component is mounted and unsubscribe when the component is unmounted. Consider migrating to runes instead.
|
||||||
|
|
||||||
|
|
||||||
|
## typescript_invalid_feature
|
||||||
|
|
||||||
|
```
|
||||||
|
TypeScript language features like %feature% are not natively supported, and their use is generally discouraged. Outside of `<script>` tags, these features are not supported. For use within `<script>` tags, you will need to use a preprocessor to convert it to JavaScript before it gets passed to the Svelte compiler. If you are using `vitePreprocess`, make sure to specifically enable preprocessing script tags (`vitePreprocess({ script: true })`)
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_empty_declaration
|
||||||
|
|
||||||
|
```
|
||||||
|
Declaration cannot be empty
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_expected_identifier
|
||||||
|
|
||||||
|
```
|
||||||
|
Expected a valid CSS identifier
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_global_block_invalid_combinator
|
||||||
|
|
||||||
|
```
|
||||||
|
A `:global` selector cannot follow a `%name%` combinator
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_global_block_invalid_declaration
|
||||||
|
|
||||||
|
```
|
||||||
|
A top-level `:global {...}` block can only contain rules, not declarations
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_global_block_invalid_list
|
||||||
|
|
||||||
|
```
|
||||||
|
A `:global` selector cannot be part of a selector list with more than one item
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_global_block_invalid_modifier
|
||||||
|
|
||||||
|
```
|
||||||
|
A `:global` selector cannot modify an existing selector
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_global_block_invalid_modifier_start
|
||||||
|
|
||||||
|
```
|
||||||
|
A `:global` selector can only be modified if it is a descendant of other selectors
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_global_invalid_placement
|
||||||
|
|
||||||
|
```
|
||||||
|
`:global(...)` can be at the start or end of a selector sequence, but not in the middle
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_global_invalid_selector
|
||||||
|
|
||||||
|
```
|
||||||
|
`:global(...)` must contain exactly one selector
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_global_invalid_selector_list
|
||||||
|
|
||||||
|
```
|
||||||
|
`:global(...)` must not contain type or universal selectors when used in a compound selector
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_nesting_selector_invalid_placement
|
||||||
|
|
||||||
|
```
|
||||||
|
Nesting selectors can only be used inside a rule or as the first selector inside a lone `:global(...)`
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_selector_invalid
|
||||||
|
|
||||||
|
```
|
||||||
|
Invalid selector
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_type_selector_invalid_placement
|
||||||
|
|
||||||
|
```
|
||||||
|
`:global(...)` must not be followed by a type selector
|
||||||
|
```
|
||||||
|
|
||||||
|
## animation_duplicate
|
||||||
|
|
||||||
|
```
|
||||||
|
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
|
||||||
|
```
|
||||||
|
|
||||||
|
## attribute_unquoted_sequence
|
||||||
|
|
||||||
|
```
|
||||||
|
Attribute values containing `{...}` must be enclosed in quote marks, unless the value only contains the expression
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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_character
|
||||||
|
|
||||||
|
```
|
||||||
|
Expected a `%character%` character immediately following the opening bracket
|
||||||
|
```
|
||||||
|
|
||||||
|
## block_unexpected_close
|
||||||
|
|
||||||
|
```
|
||||||
|
Unexpected block closing tag
|
||||||
|
```
|
||||||
|
|
||||||
|
## component_invalid_directive
|
||||||
|
|
||||||
|
```
|
||||||
|
This type of directive is not valid on components
|
||||||
|
```
|
||||||
|
|
||||||
|
## const_tag_cycle
|
||||||
|
|
||||||
|
```
|
||||||
|
Cyclical dependency detected: %cycle%
|
||||||
|
```
|
||||||
|
|
||||||
|
## const_tag_invalid_expression
|
||||||
|
|
||||||
|
```
|
||||||
|
{@const ...} must consist of a single variable declaration
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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_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
|
||||||
|
```
|
||||||
|
|
||||||
|
## mixed_event_handler_syntaxes
|
||||||
|
|
||||||
|
```
|
||||||
|
Mixing old (on:%name%) and new syntaxes for event handling is not allowed. Use only the on%name% syntax
|
||||||
|
```
|
||||||
|
|
||||||
|
## node_invalid_placement
|
||||||
|
|
||||||
|
```
|
||||||
|
%thing% is invalid inside `<%parent%>`
|
||||||
|
```
|
||||||
|
|
||||||
|
- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` for example (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
|
||||||
|
- `<option><div>option a</div></option>` will result in `<option>option a</option>` (the `<div>` is removed)
|
||||||
|
- `<table><tr><td>cell</td></tr></table>` will result in `<table><tbody><tr><td>cell</td></tr></tbody></table>` (a `<tbody>` is auto-inserted)
|
||||||
|
HTML restricts where certain elements can appear. In case of a violation the browser will 'repair' the HTML in a way that breaks Svelte's assumptions about the structure of your components. Some examples:
|
||||||
|
|
||||||
|
|
||||||
|
## 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 module>` element
|
||||||
|
```
|
||||||
|
|
||||||
|
## script_invalid_attribute_value
|
||||||
|
|
||||||
|
```
|
||||||
|
If the `%name%` attribute is supplied, it must be a boolean attribute
|
||||||
|
```
|
||||||
|
|
||||||
|
## script_invalid_context
|
||||||
|
|
||||||
|
```
|
||||||
|
If the context attribute is supplied, its value must be "module"
|
||||||
|
```
|
||||||
|
|
||||||
|
## script_reserved_attribute
|
||||||
|
|
||||||
|
```
|
||||||
|
The `%name%` attribute is reserved and cannot be used
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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
|
||||||
|
```
|
||||||
|
|
||||||
|
## snippet_shadowing_prop
|
||||||
|
|
||||||
|
```
|
||||||
|
This snippet is shadowing the prop `%prop%` with the same name
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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_body_illegal_attribute
|
||||||
|
|
||||||
|
```
|
||||||
|
`<svelte:body>` does not support non-event attributes or spread attributes
|
||||||
|
```
|
||||||
|
|
||||||
|
## svelte_component_invalid_this
|
||||||
|
|
||||||
|
```
|
||||||
|
Invalid component definition — must be an `{expression}`
|
||||||
|
```
|
||||||
|
|
||||||
|
## svelte_component_missing_this
|
||||||
|
|
||||||
|
```
|
||||||
|
`<svelte:component>` must have a 'this' attribute
|
||||||
|
```
|
||||||
|
|
||||||
|
## svelte_element_missing_this
|
||||||
|
|
||||||
|
```
|
||||||
|
`<svelte:element>` must have a 'this' attribute with a value
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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_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
|
||||||
|
|
||||||
|
```
|
||||||
|
Value must be %list%, if specified
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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 lowercase and hyphenated
|
||||||
|
```
|
||||||
|
|
||||||
|
See https://html.spec.whatwg.org/multipage/custom-elements.html#valid-custom-element-name for more information on valid tag names
|
||||||
|
|
||||||
|
|
||||||
|
## svelte_options_reserved_tagname
|
||||||
|
|
||||||
|
```
|
||||||
|
Tag name is reserved
|
||||||
|
```
|
||||||
|
|
||||||
|
See https://html.spec.whatwg.org/multipage/custom-elements.html#valid-custom-element-name for more information on valid tag names
|
||||||
|
|
||||||
|
|
||||||
|
## 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_name
|
||||||
|
|
||||||
|
```
|
||||||
|
Expected a valid element or component name. Components must have a valid variable name or dot notation expression
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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
|
||||||
|
```
|
@ -0,0 +1,517 @@
|
|||||||
|
---
|
||||||
|
title: 'Compiler Warnings'
|
||||||
|
generated: 'generated by process-messages/index.js'
|
||||||
|
---
|
||||||
|
|
||||||
|
## a11y_accesskey
|
||||||
|
|
||||||
|
```
|
||||||
|
Avoid using accesskey
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_aria_activedescendant_has_tabindex
|
||||||
|
|
||||||
|
```
|
||||||
|
An element with an aria-activedescendant attribute should have a tabindex value
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_aria_attributes
|
||||||
|
|
||||||
|
```
|
||||||
|
`<%name%>` should not have aria-* attributes
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_autocomplete_valid
|
||||||
|
|
||||||
|
```
|
||||||
|
'%value%' is an invalid value for 'autocomplete' on `<input type="%type%">`
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_autofocus
|
||||||
|
|
||||||
|
```
|
||||||
|
Avoid using autofocus
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_consider_explicit_label
|
||||||
|
|
||||||
|
```
|
||||||
|
Buttons and links should either contain text or have an `aria-label` or `aria-labelledby` attribute
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_distracting_elements
|
||||||
|
|
||||||
|
```
|
||||||
|
Avoid `<%name%>` elements
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_figcaption_index
|
||||||
|
|
||||||
|
```
|
||||||
|
`<figcaption>` must be first or last child of `<figure>`
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_figcaption_parent
|
||||||
|
|
||||||
|
```
|
||||||
|
`<figcaption>` must be an immediate child of `<figure>`
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_hidden
|
||||||
|
|
||||||
|
```
|
||||||
|
`<%name%>` element should not be hidden
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_img_redundant_alt
|
||||||
|
|
||||||
|
```
|
||||||
|
Screenreaders already announce `<img>` elements as an image
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_incorrect_aria_attribute_type
|
||||||
|
|
||||||
|
```
|
||||||
|
The value of '%attribute%' must be a %type%
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_incorrect_aria_attribute_type_boolean
|
||||||
|
|
||||||
|
```
|
||||||
|
The value of '%attribute%' must be either 'true' or 'false'. It cannot be empty
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_incorrect_aria_attribute_type_id
|
||||||
|
|
||||||
|
```
|
||||||
|
The value of '%attribute%' must be a string that represents a DOM element ID
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_incorrect_aria_attribute_type_idlist
|
||||||
|
|
||||||
|
```
|
||||||
|
The value of '%attribute%' must be a space-separated list of strings that represent DOM element IDs
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_incorrect_aria_attribute_type_integer
|
||||||
|
|
||||||
|
```
|
||||||
|
The value of '%attribute%' must be an integer
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_incorrect_aria_attribute_type_token
|
||||||
|
|
||||||
|
```
|
||||||
|
The value of '%attribute%' must be exactly one of %values%
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_incorrect_aria_attribute_type_tokenlist
|
||||||
|
|
||||||
|
```
|
||||||
|
The value of '%attribute%' must be a space-separated list of one or more of %values%
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_invalid_attribute
|
||||||
|
|
||||||
|
```
|
||||||
|
'%href_value%' is not a valid %href_attribute% attribute
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_label_has_associated_control
|
||||||
|
|
||||||
|
```
|
||||||
|
A form label must be associated with a control
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_media_has_caption
|
||||||
|
|
||||||
|
```
|
||||||
|
`<video>` elements must have a `<track kind="captions">`
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_misplaced_role
|
||||||
|
|
||||||
|
```
|
||||||
|
`<%name%>` should not have role attribute
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_misplaced_scope
|
||||||
|
|
||||||
|
```
|
||||||
|
The scope attribute should only be used with `<th>` elements
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_missing_attribute
|
||||||
|
|
||||||
|
```
|
||||||
|
`<%name%>` element should have %article% %sequence% attribute
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_missing_content
|
||||||
|
|
||||||
|
```
|
||||||
|
`<%name%>` element should contain text
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_mouse_events_have_key_events
|
||||||
|
|
||||||
|
```
|
||||||
|
'%event%' event must be accompanied by '%accompanied_by%' event
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_no_abstract_role
|
||||||
|
|
||||||
|
```
|
||||||
|
Abstract role '%role%' is forbidden
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_no_interactive_element_to_noninteractive_role
|
||||||
|
|
||||||
|
```
|
||||||
|
`<%element%>` cannot have role '%role%'
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_no_noninteractive_element_interactions
|
||||||
|
|
||||||
|
```
|
||||||
|
Non-interactive element `<%element%>` should not be assigned mouse or keyboard event listeners
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_no_noninteractive_element_to_interactive_role
|
||||||
|
|
||||||
|
```
|
||||||
|
Non-interactive element `<%element%>` cannot have interactive role '%role%'
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_no_noninteractive_tabindex
|
||||||
|
|
||||||
|
```
|
||||||
|
noninteractive element cannot have nonnegative tabIndex value
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_no_redundant_roles
|
||||||
|
|
||||||
|
```
|
||||||
|
Redundant role '%role%'
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_no_static_element_interactions
|
||||||
|
|
||||||
|
```
|
||||||
|
`<%element%>` with a %handler% handler must have an ARIA role
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_positive_tabindex
|
||||||
|
|
||||||
|
```
|
||||||
|
Avoid tabindex values above zero
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_role_has_required_aria_props
|
||||||
|
|
||||||
|
```
|
||||||
|
Elements with the ARIA role "%role%" must have the following attributes defined: %props%
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_role_supports_aria_props
|
||||||
|
|
||||||
|
```
|
||||||
|
The attribute '%attribute%' is not supported by the role '%role%'
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_role_supports_aria_props_implicit
|
||||||
|
|
||||||
|
```
|
||||||
|
The attribute '%attribute%' is not supported by the role '%role%'. This role is implicit on the element `<%name%>`
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_unknown_aria_attribute
|
||||||
|
|
||||||
|
```
|
||||||
|
Unknown aria attribute 'aria-%attribute%'
|
||||||
|
```
|
||||||
|
```
|
||||||
|
Unknown aria attribute 'aria-%attribute%'. Did you mean '%suggestion%'?
|
||||||
|
```
|
||||||
|
|
||||||
|
## a11y_unknown_role
|
||||||
|
|
||||||
|
```
|
||||||
|
Unknown role '%role%'
|
||||||
|
```
|
||||||
|
```
|
||||||
|
Unknown role '%role%'. Did you mean '%suggestion%'?
|
||||||
|
```
|
||||||
|
|
||||||
|
## legacy_code
|
||||||
|
|
||||||
|
```
|
||||||
|
`%code%` is no longer valid — please use `%suggestion%` instead
|
||||||
|
```
|
||||||
|
|
||||||
|
## unknown_code
|
||||||
|
|
||||||
|
```
|
||||||
|
`%code%` is not a recognised code
|
||||||
|
```
|
||||||
|
```
|
||||||
|
`%code%` is not a recognised code (did you mean `%suggestion%`?)
|
||||||
|
```
|
||||||
|
|
||||||
|
## options_deprecated_accessors
|
||||||
|
|
||||||
|
```
|
||||||
|
The `accessors` option has been deprecated. It will have no effect in runes mode
|
||||||
|
```
|
||||||
|
|
||||||
|
## options_deprecated_immutable
|
||||||
|
|
||||||
|
```
|
||||||
|
The `immutable` option has been deprecated. It will have no effect in runes mode
|
||||||
|
```
|
||||||
|
|
||||||
|
## options_missing_custom_element
|
||||||
|
|
||||||
|
```
|
||||||
|
The `customElement` option is used when generating a custom element. Did you forget the `customElement: true` compile option?
|
||||||
|
```
|
||||||
|
|
||||||
|
## options_removed_enable_sourcemap
|
||||||
|
|
||||||
|
```
|
||||||
|
The `enableSourcemap` option has been removed. Source maps are always generated now, and tooling can choose to ignore them
|
||||||
|
```
|
||||||
|
|
||||||
|
## options_removed_hydratable
|
||||||
|
|
||||||
|
```
|
||||||
|
The `hydratable` option has been removed. Svelte components are always hydratable now
|
||||||
|
```
|
||||||
|
|
||||||
|
## options_removed_loop_guard_timeout
|
||||||
|
|
||||||
|
```
|
||||||
|
The `loopGuardTimeout` option has been removed
|
||||||
|
```
|
||||||
|
|
||||||
|
## options_renamed_ssr_dom
|
||||||
|
|
||||||
|
```
|
||||||
|
`generate: "dom"` and `generate: "ssr"` options have been renamed to "client" and "server" respectively
|
||||||
|
```
|
||||||
|
|
||||||
|
## export_let_unused
|
||||||
|
|
||||||
|
```
|
||||||
|
Component has unused export property '%name%'. If it is for external reference only, please consider using `export const %name%`
|
||||||
|
```
|
||||||
|
|
||||||
|
## legacy_component_creation
|
||||||
|
|
||||||
|
```
|
||||||
|
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
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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_dependency
|
||||||
|
|
||||||
|
```
|
||||||
|
Reassignments of module-level declarations will not cause reactive statements to update
|
||||||
|
```
|
||||||
|
|
||||||
|
## reactive_declaration_non_reactive_property
|
||||||
|
|
||||||
|
```
|
||||||
|
Properties of objects and arrays are not reactive unless in runes mode. Changes to this property will not cause the reactive statement to update
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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
|
||||||
|
```
|
||||||
|
|
||||||
|
## css_unused_selector
|
||||||
|
|
||||||
|
```
|
||||||
|
Unused CSS selector "%name%"
|
||||||
|
```
|
||||||
|
|
||||||
|
## attribute_avoid_is
|
||||||
|
|
||||||
|
```
|
||||||
|
The "is" attribute is not supported cross-browser and should be avoided
|
||||||
|
```
|
||||||
|
|
||||||
|
## attribute_global_event_reference
|
||||||
|
|
||||||
|
```
|
||||||
|
You are referencing `globalThis.%name%`. Did you forget to declare a variable with that name?
|
||||||
|
```
|
||||||
|
|
||||||
|
## attribute_illegal_colon
|
||||||
|
|
||||||
|
```
|
||||||
|
Attributes should not contain ':' characters to prevent ambiguity with Svelte directives
|
||||||
|
```
|
||||||
|
|
||||||
|
## attribute_invalid_property_name
|
||||||
|
|
||||||
|
```
|
||||||
|
'%wrong%' is not a valid HTML attribute. Did you mean '%right%'?
|
||||||
|
```
|
||||||
|
|
||||||
|
## attribute_quoted
|
||||||
|
|
||||||
|
```
|
||||||
|
Quoted attributes on components and custom elements will be stringified in a future version of Svelte. If this isn't what you want, remove the quotes
|
||||||
|
```
|
||||||
|
|
||||||
|
## bind_invalid_each_rest
|
||||||
|
|
||||||
|
```
|
||||||
|
The rest operator (...) will create a new object and binding '%name%' with the original object will not work
|
||||||
|
```
|
||||||
|
|
||||||
|
## block_empty
|
||||||
|
|
||||||
|
```
|
||||||
|
Empty block
|
||||||
|
```
|
||||||
|
|
||||||
|
## component_name_lowercase
|
||||||
|
|
||||||
|
```
|
||||||
|
`<%name%>` will be treated as an HTML element unless it begins with a capital letter
|
||||||
|
```
|
||||||
|
|
||||||
|
## element_invalid_self_closing_tag
|
||||||
|
|
||||||
|
```
|
||||||
|
Self-closing HTML tags for non-void elements are ambiguous — use `<%name% ...></%name%>` rather than `<%name% ... />`
|
||||||
|
```
|
||||||
|
|
||||||
|
## event_directive_deprecated
|
||||||
|
|
||||||
|
```
|
||||||
|
Using `on:%name%` to listen to the %name% event is deprecated. Use the event attribute `on%name%` instead
|
||||||
|
```
|
||||||
|
|
||||||
|
## node_invalid_placement_ssr
|
||||||
|
|
||||||
|
```
|
||||||
|
%thing% is invalid inside `<%parent%>`. When rendering this component on the server, the resulting HTML will be modified by the browser, likely resulting in a `hydration_mismatch` warning
|
||||||
|
```
|
||||||
|
|
||||||
|
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.
|
||||||
|
- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` for example (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
|
||||||
|
- `<option><div>option a</div></option>` will result in `<option>option a</option>` (the `<div>` is removed)
|
||||||
|
- `<table><tr><td>cell</td></tr></table>` will result in `<table><tbody><tr><td>cell</td></tr></tbody></table>` (a `<tbody>` is auto-inserted)
|
||||||
|
HTML restricts where certain elements can appear. In case of a violation the browser will 'repair' the HTML in a way that breaks Svelte's assumptions about the structure of your components. Some examples:
|
||||||
|
|
||||||
|
|
||||||
|
## script_context_deprecated
|
||||||
|
|
||||||
|
```
|
||||||
|
`context="module"` is deprecated, use the `module` attribute instead
|
||||||
|
```
|
||||||
|
|
||||||
|
## script_unknown_attribute
|
||||||
|
|
||||||
|
```
|
||||||
|
Unrecognized attribute — should be one of `generics`, `lang` or `module`. If this exists for a preprocessor, ensure that the preprocessor removes it
|
||||||
|
```
|
||||||
|
|
||||||
|
## slot_element_deprecated
|
||||||
|
|
||||||
|
```
|
||||||
|
Using `<slot>` to render parent content is deprecated. Use `{@render ...}` tags instead
|
||||||
|
```
|
||||||
|
|
||||||
|
## svelte_component_deprecated
|
||||||
|
|
||||||
|
```
|
||||||
|
`<svelte:component>` is deprecated in runes mode — components are dynamic by default
|
||||||
|
```
|
||||||
|
|
||||||
|
```diff
|
||||||
|
<script>
|
||||||
|
...
|
||||||
|
let condition = $state(false);
|
||||||
|
+ const Component = $derived(condition ? Y : Z);
|
||||||
|
</script>
|
||||||
|
- <svelte:component this={condition ? Y : Z} />
|
||||||
|
+ <Component />
|
||||||
|
```
|
||||||
|
A derived value may be used in other contexts:
|
||||||
|
```diff
|
||||||
|
{#each items as item}
|
||||||
|
- <svelte:component this={item.condition ? Y : Z} />
|
||||||
|
+ {@const Component = item.condition ? Y : Z}
|
||||||
|
+ <Component />
|
||||||
|
{/each}
|
||||||
|
```
|
||||||
|
For complex component resolution logic, an intermediary, capitalized variable may be necessary. E.g. in places where `@const` can be used:
|
||||||
|
In some cases `<object.property>` syntax can be used as a replacement; a lowercased variable with property access is recognized as a component in Svelte 5.
|
||||||
|
In Svelte 5 this is no longer true — if `X` changes, `<X>` re-renders.
|
||||||
|
In previous versions of Svelte, the component constructor was fixed when the component was rendered. In other words, if you wanted `<X>` to re-render when `X` changed, you would either have to use `<svelte:component this={X}>` or put the component inside a `{#key X}...{/key}` block.
|
||||||
|
|
||||||
|
|
||||||
|
## svelte_element_invalid_this
|
||||||
|
|
||||||
|
```
|
||||||
|
`this` should be an `{expression}`. Using a string attribute value will cause an error in future versions of Svelte
|
||||||
|
```
|
||||||
|
|
||||||
|
## svelte_self_deprecated
|
||||||
|
|
||||||
|
```
|
||||||
|
`<svelte:self>` is deprecated — use self-imports (e.g. `import %name% from './%basename%'`) instead
|
||||||
|
```
|
@ -0,0 +1,163 @@
|
|||||||
|
---
|
||||||
|
title: 'Runtime Errors'
|
||||||
|
generated: 'generated by process-messages/index.js'
|
||||||
|
---
|
||||||
|
|
||||||
|
## bind_invalid_checkbox_value
|
||||||
|
|
||||||
|
```
|
||||||
|
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()`
|
||||||
|
```
|
||||||
|
|
||||||
|
## component_api_changed
|
||||||
|
|
||||||
|
```
|
||||||
|
%parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
|
||||||
|
```
|
||||||
|
|
||||||
|
## component_api_invalid_new
|
||||||
|
|
||||||
|
```
|
||||||
|
Attempted to instantiate %component% with `new %name%`, which is no longer valid in Svelte 5. If this component is not under your control, set the `compatibility.componentApi` compiler option to `4` to keep it working. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
|
||||||
|
```
|
||||||
|
|
||||||
|
## derived_references_self
|
||||||
|
|
||||||
|
```
|
||||||
|
A derived value cannot reference itself recursively
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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_in_unowned_derived
|
||||||
|
|
||||||
|
```
|
||||||
|
Effect cannot be created inside a `$derived` value that was not itself created inside an effect
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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_failed
|
||||||
|
|
||||||
|
```
|
||||||
|
Failed to hydrate the application
|
||||||
|
```
|
||||||
|
|
||||||
|
## invalid_snippet
|
||||||
|
|
||||||
|
```
|
||||||
|
Could not `{@render}` snippet due to the expression being `null` or `undefined`. Consider using optional chaining `{@render snippet?.()}`
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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_descriptors_fixed
|
||||||
|
|
||||||
|
```
|
||||||
|
Property descriptors defined on `$state` objects must contain `value` and always be `enumerable`, `configurable` and `writable`.
|
||||||
|
```
|
||||||
|
|
||||||
|
## state_prototype_fixed
|
||||||
|
|
||||||
|
```
|
||||||
|
Cannot set prototype of `$state` object
|
||||||
|
```
|
||||||
|
|
||||||
|
## state_unsafe_local_read
|
||||||
|
|
||||||
|
```
|
||||||
|
Reading state that was created inside the same derived is forbidden. Consider using `untrack` to read locally created state
|
||||||
|
```
|
||||||
|
|
||||||
|
## state_unsafe_mutation
|
||||||
|
|
||||||
|
```
|
||||||
|
Updating state inside a derived is forbidden. If the value should not be reactive, declare it without `$state`
|
||||||
|
```
|
||||||
|
|
||||||
|
## lifecycle_function_unavailable
|
||||||
|
|
||||||
|
```
|
||||||
|
`%name%(...)` is not available on the server
|
||||||
|
```
|
||||||
|
|
||||||
|
## invalid_default_snippet
|
||||||
|
|
||||||
|
```
|
||||||
|
Cannot use `{@render children(...)}` if the parent component uses `let:` directives. Consider using a named snippet instead
|
||||||
|
```
|
||||||
|
|
||||||
|
## lifecycle_outside_component
|
||||||
|
|
||||||
|
```
|
||||||
|
`%name%(...)` can only be used during component initialisation
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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
|
||||||
|
```
|
@ -0,0 +1,114 @@
|
|||||||
|
---
|
||||||
|
title: 'Runtime Warnings'
|
||||||
|
generated: 'generated by process-messages/index.js'
|
||||||
|
---
|
||||||
|
|
||||||
|
## binding_property_non_reactive
|
||||||
|
|
||||||
|
```
|
||||||
|
`%binding%` is binding to a non-reactive property
|
||||||
|
```
|
||||||
|
```
|
||||||
|
`%binding%` (%location%) is binding to a non-reactive property
|
||||||
|
```
|
||||||
|
|
||||||
|
## console_log_state
|
||||||
|
|
||||||
|
```
|
||||||
|
Your `console.%method%` contained `$state` proxies. Consider using `$inspect(...)` or `$state.snapshot(...)` instead
|
||||||
|
```
|
||||||
|
|
||||||
|
The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte-5-preview.vercel.app/docs/runes#$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte-5-preview.vercel.app/docs/runes#$state-snapshot) to take a snapshot of the current value.
|
||||||
|
When logging a [proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy), browser devtools will log the proxy itself rather than the value it represents. In the case of Svelte, the 'target' of a `$state` proxy might not resemble its current value, which can be confusing.
|
||||||
|
|
||||||
|
|
||||||
|
## event_handler_invalid
|
||||||
|
|
||||||
|
```
|
||||||
|
%handler% should be a function. Did you mean to %suggestion%?
|
||||||
|
```
|
||||||
|
|
||||||
|
## hydration_attribute_changed
|
||||||
|
|
||||||
|
```
|
||||||
|
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_html_changed
|
||||||
|
|
||||||
|
```
|
||||||
|
The value of an `{@html ...}` block changed between server and client renders. The client value will be ignored in favour of the server value
|
||||||
|
```
|
||||||
|
```
|
||||||
|
The value of an `{@html ...}` block %location% changed between server and client renders. The client 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
|
||||||
|
```
|
||||||
|
```
|
||||||
|
Hydration failed because the initial UI does not match what was rendered on the server. The error occurred near %location%
|
||||||
|
```
|
||||||
|
|
||||||
|
## invalid_raw_snippet_render
|
||||||
|
|
||||||
|
```
|
||||||
|
The `render` function passed to `createRawSnippet` should return HTML for a single element
|
||||||
|
```
|
||||||
|
|
||||||
|
## lifecycle_double_unmount
|
||||||
|
|
||||||
|
```
|
||||||
|
Tried to unmount a component that was not mounted
|
||||||
|
```
|
||||||
|
|
||||||
|
## ownership_invalid_binding
|
||||||
|
|
||||||
|
```
|
||||||
|
%parent% passed a value to %child% with `bind:`, but the value is owned by %owner%. Consider creating a binding between %owner% and %parent%
|
||||||
|
```
|
||||||
|
|
||||||
|
## ownership_invalid_mutation
|
||||||
|
|
||||||
|
```
|
||||||
|
Mutating a value outside the component that created it is strongly discouraged. Consider passing values to child components with `bind:`, or use a callback instead
|
||||||
|
```
|
||||||
|
```
|
||||||
|
%component% mutated a value owned by %owner%. This is strongly discouraged. Consider passing values to child components with `bind:`, or use a callback instead
|
||||||
|
```
|
||||||
|
|
||||||
|
## state_proxy_equality_mismatch
|
||||||
|
|
||||||
|
```
|
||||||
|
Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `%operator%` will produce unexpected results
|
||||||
|
```
|
||||||
|
|
||||||
|
To resolve this, ensure you're comparing values where both values were created with `$state(...)`, or neither were. Note that `$state.raw(...)` will _not_ create a state proxy.
|
||||||
|
value === proxy; // always false
|
||||||
|
</script>
|
||||||
|
```
|
||||||
|
```svelte
|
||||||
|
<script>
|
||||||
|
let value = { foo: 'bar' };
|
||||||
|
let proxy = $state(value);
|
||||||
|
`$state(...)` creates a [proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy) of the value it is passed. The proxy and the value have different identities, meaning equality checks will always return `false`:
|
||||||
|
|
||||||
|
|
||||||
|
## dynamic_void_element_content
|
||||||
|
|
||||||
|
```
|
||||||
|
`<svelte:element this="%tag%">` is a void element — it cannot have content
|
||||||
|
```
|
||||||
|
|
||||||
|
## state_snapshot_uncloneable
|
||||||
|
|
||||||
|
```
|
||||||
|
Value cannot be cloned with `$state.snapshot` — the original value was returned
|
||||||
|
```
|
||||||
|
```
|
||||||
|
The following properties cannot be cloned with `$state.snapshot` — the return value contains the originals:
|
||||||
|
|
||||||
|
%properties%
|
||||||
|
```
|
Loading…
Reference in new issue