mirror of https://github.com/sveltejs/svelte
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
639 lines
18 KiB
639 lines
18 KiB
---
|
|
title: 'Compiler errors'
|
|
generated: 'generated by process-messages/index.js'
|
|
---
|
|
|
|
## `animation_duplicate`
|
|
|
|
> [!NOTE] An element can only have one 'animate' directive
|
|
|
|
## `animation_invalid_placement`
|
|
|
|
> [!NOTE] An element that uses the 'animate:' directive must be the only child of a keyed '{#each ...}' block
|
|
|
|
## `animation_missing_key`
|
|
|
|
> [!NOTE] 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`
|
|
|
|
> [!NOTE] 'contenteditable' attribute cannot be dynamic if element uses two-way binding
|
|
|
|
## `attribute_contenteditable_missing`
|
|
|
|
> [!NOTE] 'contenteditable' attribute is required for textContent, innerHTML and innerText two-way bindings
|
|
|
|
## `attribute_duplicate`
|
|
|
|
> [!NOTE] Attributes need to be unique
|
|
|
|
## `attribute_empty_shorthand`
|
|
|
|
> [!NOTE] Attribute shorthand cannot be empty
|
|
|
|
## `attribute_invalid_event_handler`
|
|
|
|
> [!NOTE] Event attribute must be a JavaScript expression, not a string
|
|
|
|
## `attribute_invalid_multiple`
|
|
|
|
> [!NOTE] 'multiple' attribute must be static if select uses two-way binding
|
|
|
|
## `attribute_invalid_name`
|
|
|
|
> [!NOTE] '%name%' is not a valid attribute name
|
|
|
|
## `attribute_invalid_sequence_expression`
|
|
|
|
> [!NOTE] Sequence expressions are not allowed as attribute/directive values in runes mode, unless wrapped in parentheses
|
|
|
|
## `attribute_invalid_type`
|
|
|
|
> [!NOTE] 'type' attribute must be a static text value if input uses two-way binding
|
|
|
|
## `attribute_unquoted_sequence`
|
|
|
|
> [!NOTE] Attribute values containing '{...}' must be enclosed in quote marks, unless the value only contains the expression
|
|
|
|
## `bind_invalid_expression`
|
|
|
|
> [!NOTE] Can only bind to an Identifier or MemberExpression
|
|
|
|
## `bind_invalid_name`
|
|
|
|
> [!NOTE] 'bind:%name%' is not a valid binding
|
|
|
|
> [!NOTE] 'bind:%name%' is not a valid binding. %explanation%
|
|
|
|
## `bind_invalid_target`
|
|
|
|
> [!NOTE] 'bind:%name%' can only be used with %elements%
|
|
|
|
## `bind_invalid_value`
|
|
|
|
> [!NOTE] Can only bind to state or props
|
|
|
|
## `bindable_invalid_location`
|
|
|
|
> [!NOTE] '$bindable()' can only be used inside a '$props()' declaration
|
|
|
|
## `block_duplicate_clause`
|
|
|
|
> [!NOTE] %name% cannot appear more than once within a block
|
|
|
|
## `block_invalid_continuation_placement`
|
|
|
|
> [!NOTE] {:...} block is invalid at this position (did you forget to close the preceeding element or block?)
|
|
|
|
## `block_invalid_elseif`
|
|
|
|
> [!NOTE] 'elseif' should be 'else if'
|
|
|
|
## `block_invalid_placement`
|
|
|
|
> [!NOTE] {#%name% ...} block cannot be %location%
|
|
|
|
## `block_unclosed`
|
|
|
|
> [!NOTE] Block was left open
|
|
|
|
## `block_unexpected_character`
|
|
|
|
> [!NOTE] Expected a '%character%' character immediately following the opening bracket
|
|
|
|
## `block_unexpected_close`
|
|
|
|
> [!NOTE] Unexpected block closing tag
|
|
|
|
## `component_invalid_directive`
|
|
|
|
> [!NOTE] This type of directive is not valid on components
|
|
|
|
## `const_tag_cycle`
|
|
|
|
> [!NOTE] Cyclical dependency detected: %cycle%
|
|
|
|
## `const_tag_invalid_expression`
|
|
|
|
> [!NOTE] {@const ...} must consist of a single variable declaration
|
|
|
|
## `const_tag_invalid_placement`
|
|
|
|
> [!NOTE] '{@const}' must be the immediate child of '{#snippet}', '{#if}', '{:else if}', '{:else}', '{#each}', '{:then}', '{:catch}', '\<svelte:fragment>' or '\<Component>'
|
|
|
|
## `constant_assignment`
|
|
|
|
> [!NOTE] Cannot assign to %thing%
|
|
|
|
## `constant_binding`
|
|
|
|
> [!NOTE] Cannot bind to %thing%
|
|
|
|
## `css_empty_declaration`
|
|
|
|
> [!NOTE] Declaration cannot be empty
|
|
|
|
## `css_expected_identifier`
|
|
|
|
> [!NOTE] Expected a valid CSS identifier
|
|
|
|
## `css_global_block_invalid_combinator`
|
|
|
|
> [!NOTE] A ':global' selector cannot follow a '%name%' combinator
|
|
|
|
## `css_global_block_invalid_declaration`
|
|
|
|
> [!NOTE] A top-level ':global {...}' block can only contain rules, not declarations
|
|
|
|
## `css_global_block_invalid_list`
|
|
|
|
> [!NOTE] A ':global' selector cannot be part of a selector list with more than one item
|
|
|
|
## `css_global_block_invalid_modifier`
|
|
|
|
> [!NOTE] A ':global' selector cannot modify an existing selector
|
|
|
|
## `css_global_block_invalid_modifier_start`
|
|
|
|
> [!NOTE] A ':global' selector can only be modified if it is a descendant of other selectors
|
|
|
|
## `css_global_invalid_placement`
|
|
|
|
> [!NOTE] ':global(...)' can be at the start or end of a selector sequence, but not in the middle
|
|
|
|
## `css_global_invalid_selector`
|
|
|
|
> [!NOTE] ':global(...)' must contain exactly one selector
|
|
|
|
## `css_global_invalid_selector_list`
|
|
|
|
> [!NOTE] ':global(...)' must not contain type or universal selectors when used in a compound selector
|
|
|
|
## `css_nesting_selector_invalid_placement`
|
|
|
|
> [!NOTE] Nesting selectors can only be used inside a rule or as the first selector inside a lone ':global(...)'
|
|
|
|
## `css_selector_invalid`
|
|
|
|
> [!NOTE] Invalid selector
|
|
|
|
## `css_type_selector_invalid_placement`
|
|
|
|
> [!NOTE] ':global(...)' must not be followed by a type selector
|
|
|
|
## `debug_tag_invalid_arguments`
|
|
|
|
> [!NOTE] {@debug ...} arguments must be identifiers, not arbitrary expressions
|
|
|
|
## `declaration_duplicate`
|
|
|
|
> [!NOTE] '%name%' has already been declared
|
|
|
|
## `declaration_duplicate_module_import`
|
|
|
|
> [!NOTE] Cannot declare a variable with the same name as an import inside '\<script module>'
|
|
|
|
## `derived_invalid_export`
|
|
|
|
> [!NOTE] Cannot export derived state from a module. To expose the current derived value, export a function returning its value
|
|
|
|
## `directive_invalid_value`
|
|
|
|
> [!NOTE] Directive value must be a JavaScript expression enclosed in curly braces
|
|
|
|
## `directive_missing_name`
|
|
|
|
> [!NOTE] '%type%' name cannot be empty
|
|
|
|
## `dollar_binding_invalid`
|
|
|
|
> [!NOTE] The $ name is reserved, and cannot be used for variables and imports
|
|
|
|
## `dollar_prefix_invalid`
|
|
|
|
> [!NOTE] The $ prefix is reserved, and cannot be used for variables and imports
|
|
|
|
## `each_item_invalid_assignment`
|
|
|
|
> [!NOTE] 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`
|
|
|
|
> [!NOTE] '$effect()' can only be used as an expression statement
|
|
|
|
## `element_invalid_closing_tag`
|
|
|
|
> [!NOTE] '\</%name%>' attempted to close an element that was not open
|
|
|
|
## `element_invalid_closing_tag_autoclosed`
|
|
|
|
> [!NOTE] '\</%name%>' attempted to close element that was already automatically closed by '\<%reason%>' (cannot nest '\<%reason%>' inside '\<%name%>')
|
|
|
|
## `element_unclosed`
|
|
|
|
> [!NOTE] '\<%name%>' was left open
|
|
|
|
## `event_handler_invalid_component_modifier`
|
|
|
|
> [!NOTE] Event modifiers other than 'once' can only be used on DOM elements
|
|
|
|
## `event_handler_invalid_modifier`
|
|
|
|
> [!NOTE] Valid event modifiers are %list%
|
|
|
|
## `event_handler_invalid_modifier_combination`
|
|
|
|
> [!NOTE] The '%modifier1%' and '%modifier2%' modifiers cannot be used together
|
|
|
|
## `expected_attribute_value`
|
|
|
|
> [!NOTE] Expected attribute value
|
|
|
|
## `expected_block_type`
|
|
|
|
> [!NOTE] Expected 'if', 'each', 'await', 'key' or 'snippet'
|
|
|
|
## `expected_identifier`
|
|
|
|
> [!NOTE] Expected an identifier
|
|
|
|
## `expected_pattern`
|
|
|
|
> [!NOTE] Expected identifier or destructure pattern
|
|
|
|
## `expected_token`
|
|
|
|
> [!NOTE] Expected token %token%
|
|
|
|
## `expected_whitespace`
|
|
|
|
> [!NOTE] Expected whitespace
|
|
|
|
## `global_reference_invalid`
|
|
|
|
> [!NOTE] '%name%' is an illegal variable name. To reference a global variable called '%name%', use 'globalThis.%name%'
|
|
|
|
## `host_invalid_placement`
|
|
|
|
> [!NOTE] '$host()' can only be used inside custom element component instances
|
|
|
|
## `import_svelte_internal_forbidden`
|
|
|
|
> [!NOTE] 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`
|
|
|
|
> [!NOTE] The arguments keyword cannot be used within the template or at the top level of a component
|
|
|
|
## `js_parse_error`
|
|
|
|
> [!NOTE] %message%
|
|
|
|
## `legacy_export_invalid`
|
|
|
|
> [!NOTE] Cannot use 'export let' in runes mode — use '$props()' instead
|
|
|
|
## `legacy_props_invalid`
|
|
|
|
> [!NOTE] Cannot use '$$props' in runes mode
|
|
|
|
## `legacy_reactive_statement_invalid`
|
|
|
|
> [!NOTE] '$:' is not allowed in runes mode, use '$derived' or '$effect' instead
|
|
|
|
## `legacy_rest_props_invalid`
|
|
|
|
> [!NOTE] Cannot use '$$restProps' in runes mode
|
|
|
|
## `let_directive_invalid_placement`
|
|
|
|
> [!NOTE] 'let:' directive at invalid position
|
|
|
|
## `mixed_event_handler_syntaxes`
|
|
|
|
> [!NOTE] Mixing old (on:%name%) and new syntaxes for event handling is not allowed. Use only the on%name% syntax
|
|
|
|
## `module_illegal_default_export`
|
|
|
|
> [!NOTE] A component cannot have a default export
|
|
|
|
## `node_invalid_placement`
|
|
|
|
> [!NOTE] %thing% is invalid inside '\<%parent%>'
|
|
|
|
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:
|
|
|
|
- `<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)
|
|
|
|
## `options_invalid_value`
|
|
|
|
> [!NOTE] Invalid compiler option: %details%
|
|
|
|
## `options_removed`
|
|
|
|
> [!NOTE] Invalid compiler option: %details%
|
|
|
|
## `options_unrecognised`
|
|
|
|
> [!NOTE] Unrecognised compiler option %keypath%
|
|
|
|
## `props_duplicate`
|
|
|
|
> [!NOTE] Cannot use '$props()' more than once
|
|
|
|
## `props_illegal_name`
|
|
|
|
> [!NOTE] Declaring or accessing a prop starting with '$$' is illegal (they are reserved for Svelte internals)
|
|
|
|
## `props_invalid_identifier`
|
|
|
|
> [!NOTE] '$props()' can only be used with an object destructuring pattern
|
|
|
|
## `props_invalid_pattern`
|
|
|
|
> [!NOTE] '$props()' assignment must not contain nested properties or computed keys
|
|
|
|
## `props_invalid_placement`
|
|
|
|
> [!NOTE] '$props()' can only be used at the top level of components as a variable declaration initializer
|
|
|
|
## `reactive_declaration_cycle`
|
|
|
|
> [!NOTE] Cyclical dependency detected: %cycle%
|
|
|
|
## `render_tag_invalid_call_expression`
|
|
|
|
> [!NOTE] Calling a snippet function using apply, bind or call is not allowed
|
|
|
|
## `render_tag_invalid_expression`
|
|
|
|
> [!NOTE] '{@render ...}' tags can only contain call expressions
|
|
|
|
## `render_tag_invalid_spread_argument`
|
|
|
|
> [!NOTE] cannot use spread arguments in '{@render ...}' tags
|
|
|
|
## `rune_invalid_arguments`
|
|
|
|
> [!NOTE] '%rune%' cannot be called with arguments
|
|
|
|
## `rune_invalid_arguments_length`
|
|
|
|
> [!NOTE] '%rune%' must be called with %args%
|
|
|
|
## `rune_invalid_computed_property`
|
|
|
|
> [!NOTE] Cannot access a computed property of a rune
|
|
|
|
## `rune_invalid_name`
|
|
|
|
> [!NOTE] '%name%' is not a valid rune
|
|
|
|
## `rune_invalid_usage`
|
|
|
|
> [!NOTE] Cannot use '%rune%' rune in non-runes mode
|
|
|
|
## `rune_missing_parentheses`
|
|
|
|
> [!NOTE] Cannot use rune without parentheses
|
|
|
|
## `rune_removed`
|
|
|
|
> [!NOTE] The '%name%' rune has been removed
|
|
|
|
## `rune_renamed`
|
|
|
|
> [!NOTE] '%name%' is now '%replacement%'
|
|
|
|
## `runes_mode_invalid_import`
|
|
|
|
> [!NOTE] %name% cannot be used in runes mode
|
|
|
|
## `script_duplicate`
|
|
|
|
> [!NOTE] A component can have a single top-level '\<script>' element and/or a single top-level '\<script module>' element
|
|
|
|
## `script_invalid_attribute_value`
|
|
|
|
> [!NOTE] If the '%name%' attribute is supplied, it must be a boolean attribute
|
|
|
|
## `script_invalid_context`
|
|
|
|
> [!NOTE] If the context attribute is supplied, its value must be "module"
|
|
|
|
## `script_reserved_attribute`
|
|
|
|
> [!NOTE] The '%name%' attribute is reserved and cannot be used
|
|
|
|
## `slot_attribute_duplicate`
|
|
|
|
> [!NOTE] Duplicate slot name '%name%' in \<%component%>
|
|
|
|
## `slot_attribute_invalid`
|
|
|
|
> [!NOTE] slot attribute must be a static value
|
|
|
|
## `slot_attribute_invalid_placement`
|
|
|
|
> [!NOTE] Element with a slot='...' attribute must be a child of a component or a descendant of a custom element
|
|
|
|
## `slot_default_duplicate`
|
|
|
|
> [!NOTE] Found default slot content alongside an explicit slot="default"
|
|
|
|
## `slot_element_invalid_attribute`
|
|
|
|
> [!NOTE] '\<slot>' can only receive attributes and (optionally) let directives
|
|
|
|
## `slot_element_invalid_name`
|
|
|
|
> [!NOTE] slot attribute must be a static value
|
|
|
|
## `slot_element_invalid_name_default`
|
|
|
|
> [!NOTE] 'default' is a reserved word — it cannot be used as a slot name
|
|
|
|
## `slot_snippet_conflict`
|
|
|
|
> [!NOTE] Cannot use '\<slot>' syntax and '{@render ...}' tags in the same component. Migrate towards '{@render ...}' tags completely
|
|
|
|
## `snippet_conflict`
|
|
|
|
> [!NOTE] 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`
|
|
|
|
> [!NOTE] Snippets do not support rest parameters; use an array instead
|
|
|
|
## `snippet_parameter_assignment`
|
|
|
|
> [!NOTE] Cannot reassign or bind to snippet parameter
|
|
|
|
## `snippet_shadowing_prop`
|
|
|
|
> [!NOTE] This snippet is shadowing the prop '%prop%' with the same name
|
|
|
|
## `state_invalid_export`
|
|
|
|
> [!NOTE] 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`
|
|
|
|
> [!NOTE] '%rune%(...)' can only be used as a variable declaration initializer or a class field
|
|
|
|
## `store_invalid_scoped_subscription`
|
|
|
|
> [!NOTE] Cannot subscribe to stores that are not declared at the top level of the component
|
|
|
|
## `store_invalid_subscription`
|
|
|
|
> [!NOTE] Cannot reference store value inside '\<script module>'
|
|
|
|
## `store_invalid_subscription_module`
|
|
|
|
> [!NOTE] 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.
|
|
|
|
## `style_directive_invalid_modifier`
|
|
|
|
> [!NOTE] 'style:' directive can only use the 'important' modifier
|
|
|
|
## `style_duplicate`
|
|
|
|
> [!NOTE] A component can have a single top-level '\<style>' element
|
|
|
|
## `svelte_body_illegal_attribute`
|
|
|
|
> [!NOTE] '\<svelte:body>' does not support non-event attributes or spread attributes
|
|
|
|
## `svelte_component_invalid_this`
|
|
|
|
> [!NOTE] Invalid component definition — must be an '{expression}'
|
|
|
|
## `svelte_component_missing_this`
|
|
|
|
> [!NOTE] '\<svelte:component>' must have a 'this' attribute
|
|
|
|
## `svelte_element_missing_this`
|
|
|
|
> [!NOTE] '\<svelte:element>' must have a 'this' attribute with a value
|
|
|
|
## `svelte_fragment_invalid_attribute`
|
|
|
|
> [!NOTE] '\<svelte:fragment>' can only have a slot attribute and (optionally) a let: directive
|
|
|
|
## `svelte_fragment_invalid_placement`
|
|
|
|
> [!NOTE] '\<svelte:fragment>' must be the direct child of a component
|
|
|
|
## `svelte_head_illegal_attribute`
|
|
|
|
> [!NOTE] '\<svelte:head>' cannot have attributes nor directives
|
|
|
|
## `svelte_meta_duplicate`
|
|
|
|
> [!NOTE] A component can only have one '\<%name%>' element
|
|
|
|
## `svelte_meta_invalid_content`
|
|
|
|
> [!NOTE] \<%name%> cannot have children
|
|
|
|
## `svelte_meta_invalid_placement`
|
|
|
|
> [!NOTE] '\<%name%>' tags cannot be inside elements or blocks
|
|
|
|
## `svelte_meta_invalid_tag`
|
|
|
|
> [!NOTE] Valid '\<svelte:...>' tag names are %list%
|
|
|
|
## `svelte_options_deprecated_tag`
|
|
|
|
> [!NOTE] "tag" option is deprecated — use "customElement" instead
|
|
|
|
## `svelte_options_invalid_attribute`
|
|
|
|
> [!NOTE] '\<svelte:options>' can only receive static attributes
|
|
|
|
## `svelte_options_invalid_attribute_value`
|
|
|
|
> [!NOTE] Value must be %list%, if specified
|
|
|
|
## `svelte_options_invalid_customelement`
|
|
|
|
> [!NOTE] "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`
|
|
|
|
> [!NOTE] "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`
|
|
|
|
> [!NOTE] "shadow" must be either "open" or "none"
|
|
|
|
## `svelte_options_invalid_tagname`
|
|
|
|
> [!NOTE] 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`
|
|
|
|
> [!NOTE] 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`
|
|
|
|
> [!NOTE] '\<svelte:options>' unknown attribute '%name%'
|
|
|
|
## `svelte_self_invalid_placement`
|
|
|
|
> [!NOTE] '\<svelte:self>' components can only exist inside '{#if}' blocks, '{#each}' blocks, '{#snippet}' blocks or slots passed to components
|
|
|
|
## `tag_invalid_name`
|
|
|
|
> [!NOTE] Expected a valid element or component name. Components must have a valid variable name or dot notation expression
|
|
|
|
## `tag_invalid_placement`
|
|
|
|
> [!NOTE] {@%name% ...} tag cannot be %location%
|
|
|
|
## `textarea_invalid_content`
|
|
|
|
> [!NOTE] A '\<textarea>' can have either a value attribute or (equivalently) child content, but not both
|
|
|
|
## `title_illegal_attribute`
|
|
|
|
> [!NOTE] '\<title>' cannot have attributes nor directives
|
|
|
|
## `title_invalid_content`
|
|
|
|
> [!NOTE] '\<title>' can only contain text and {tags}
|
|
|
|
## `transition_conflict`
|
|
|
|
> [!NOTE] Cannot use '%type%:' alongside existing '%existing%:' directive
|
|
|
|
## `transition_duplicate`
|
|
|
|
> [!NOTE] Cannot use multiple '%type%:' directives on a single element
|
|
|
|
## `typescript_invalid_feature`
|
|
|
|
> [!NOTE] 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 })')
|
|
|
|
## `unexpected_eof`
|
|
|
|
> [!NOTE] Unexpected end of input
|
|
|
|
## `unexpected_reserved_word`
|
|
|
|
> [!NOTE] '%word%' is a reserved word in JavaScript and cannot be used here
|
|
|
|
## `void_element_invalid_content`
|
|
|
|
> [!NOTE] Void elements cannot have children or closing tags
|