Svelte参考文档

运行时错误

客户端错误

bind_invalid_checkbox_value

不允许将 `bind:value` 与复选框输入一起使用。请改用 `bind:checked`

bind_invalid_export

组件 %component% 有一个名为 `%key%` 的导出，消费组件试图使用 `bind:%key%` 访问它，这是不允许的。相反，请使用 `bind:this`（例如 `<%name% bind:this={component} />`），然后在绑定的组件实例上访问属性（例如 `component.%key%`）

bind_not_bindable

一个组件试图绑定到属于 %component% 的不可绑定属性 `%key%`（即 `<%name% bind:%key%={...}>`）。要将属性标记为可绑定：`let { %key% = $bindable() } = $props()`

component_api_changed

%parent% 在 %component% 的实例上调用了 `%method%`，这在 Svelte 5 中不再有效

更多信息请参见迁移指南。

component_api_invalid_new

试图使用 `new %name%` 实例化 %component%，这在 Svelte 5 中不再有效。如果此组件不在您的控制范围内，请将 `compatibility.componentApi` 编译器选项设置为 `4` 以保持其功能。

更多信息请参见迁移指南。

derived_references_self

派生值不能递归地引用自身

each_key_duplicate

键控的 each 块在索引 %a% 和 %b% 处有重复的键

键控的 each 块在索引 %a% 和 %b% 处有重复的键 `%value%`

effect_in_teardown

不能在效果清理函数内使用 `%rune%`

effect_in_unowned_derived

不能在未在效果内创建的 `$derived` 值内创建效果

effect_orphan

`%rune%` 只能在效果内使用（例如在组件初始化期间）

effect_update_depth_exceeded

超出最大更新深度。当响应式块或效果重复设置新值时，可能会发生这种情况。Svelte 限制嵌套更新的数量以防止无限循环

hydration_failed

应用程序水合失败

invalid_snippet

由于表达式为 `null` 或 `undefined`，无法 `{@render}` 片段。考虑使用可选链接 `{@render snippet?.()}`

lifecycle_legacy_only

在 runes 模式下不能使用 `%name%(...)`

props_invalid_value

当 `%key%` 有回退值时，不能使用 `bind:%key%={undefined}`

props_rest_readonly

`$props()` 的剩余元素属性（如 `%property%`）是只读的

rune_outside_svelte

`%rune%` 符文仅在 `.svelte` 和 `.svelte.js/ts` 文件中可用

state_descriptors_fixed

在 `$state` 对象上定义的属性描述符必须包含 `value` 并始终是 `enumerable`、`configurable` 和 `writable`。

state_prototype_fixed

无法设置 `$state` 对象的原型

state_unsafe_local_read

禁止读取在同一派生内创建的状态。考虑使用 `untrack` 来读取本地创建的状态

state_unsafe_mutation

禁止在派生或模板表达式内更新状态。如果该值不应该是响应式的，请在声明时不使用 `$state`

服务器错误

lifecycle_function_unavailable

`%name%(...)` 在服务器端不可用

某些方法（如 mount）在服务器环境下运行时无法调用。避免急切调用它们，即不要在渲染期间调用。

共享错误

invalid_default_snippet

如果父组件使用 `let:` 指令，则无法使用 `{@render children(...)}`。考虑使用命名片段代替

在这样的设置中会抛出这个错误：

Parent

<List {items} let:entry>
	<span>{entry}</span>
</List>

List

<script>
	let { items, children } = $props();
</script>

<ul>
	{#each items as item}
		<li>{@render children(item)}</li>
	{/each}
</ul>

<script lang="ts">
	let { items, children } = $props();
</script>

<ul>
	{#each items as item}
		<li>{@render children(item)}</li>
	{/each}
</ul>

这里，List.svelte 使用 {@render children(item)，这意味着它期望 Parent.svelte 使用片段。相反，Parent.svelte 使用了已弃用的 let: 指令。这种 API 组合是不兼容的，因此出现错误。

lifecycle_outside_component

`%name%(...)` 只能在组件初始化期间使用

某些生命周期方法只能在组件初始化期间使用。要修复此问题，请确保您在组件的 实例脚本的顶层 调用该方法。

<script>
	import { onMount } from 'svelte';

	function handleClick() {
		// 这是错误的
		onMount(() => {})
	}

	// 这是正确的
	onMount(() => {})
</script>

<button onclick={handleClick}>点击我</button>

store_invalid_shape

`%name%` 不是具有 `subscribe` 方法的 store

svelte_element_invalid_this_value

`<svelte:element>` 上的 `this` 属性必须是字符串（如果已定义）

在 GitHub 编辑此页面

编译器警告运行时警告