Skip to main content

Compiler errors

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_group_invalid_expression

`bind:group` can only bind to an Identifier or MemberExpression

bind_invalid_expression

Can only bind to an Identifier or MemberExpression or a `{get, set}` pair

bind_invalid_name

`bind:%name%` is not a valid binding
`bind:%name%` is not a valid binding. %explanation%

bind_invalid_parens

`bind:%name%={get, set}` must not have surrounding parentheses

bind_invalid_target

`bind:%name%` can only be used with %elements%

bind_invalid_value

Can only bind to state or props

bindable_invalid_location

`$bindable()` can only be used inside a `$props()` declaration

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 preceding 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>`

constant_assignment

Cannot assign to %thing%

constant_binding

Cannot bind to %thing%

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

debug_tag_invalid_arguments

{@debug ...} arguments must be identifiers, not arbitrary expressions

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

directive_invalid_value

Directive value must be a JavaScript expression enclosed in curly braces

directive_missing_name

`%type%` name cannot be empty

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

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

export_undefined

`%name%` is not defined

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

illegal_element_attribute

`<%name%>` does not support non-event attributes or spread attributes

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

inspect_trace_generator

`$inspect.trace(...)` cannot be used inside a generator function

inspect_trace_invalid_placement

`$inspect.trace(...)` must be the first statement of a function body

invalid_arguments_usage

The arguments keyword cannot be used within the template or at the top level of a component

js_parse_error

%message%

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

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

module_illegal_default_export

A component cannot have a default export

node_invalid_placement

%message%. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.

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> (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

Invalid compiler option: %details%

options_removed

Invalid compiler option: %details%

options_unrecognised

Unrecognised compiler option %keypath%

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%

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

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

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_export

An exported snippet can only reference things declared in a `<script module>`, or other exportable snippets

It’s possible to export a snippet from a <script module> block, but only if it doesn’t reference anything defined inside a non-module-level <script>. For example you can’t do this...

<script module>
	export { greeting };
</script>

<script>
	let message = 'hello';
</script>

{#snippet greeting(name)}
	<p>{message} {name}!</p>
{/snippet}

...because greeting references message, which is defined in the second <script>.

snippet_invalid_rest_parameter

Snippets do not support rest parameters; use an array instead

snippet_parameter_assignment

Cannot reassign or bind to snippet parameter

snippet_shadowing_prop

This snippet is shadowing the prop `%prop%` with the same name

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.

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_boundary_invalid_attribute

Valid attributes on `<svelte:boundary>` are `onerror` and `failed`

svelte_boundary_invalid_attribute_value

Attribute value must be a non-string expression

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

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 })`)

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

Edit this page on GitHub