sveltejs/svelte · error · Error

invalid_default_snippet

invalid_default_snippet

Error message

invalid_default_snippet
Cannot use `{@render children(...)}` if the parent component uses `let:` directives. Consider using a named snippet instead
https://svelte.dev/e/invalid_default_snippet

What it means

In Svelte 5, the implicit `children` snippet cannot be rendered with `{@render children(...)}` when the parent component also uses `let:` directives. The legacy `let:` slot-prop pattern conflicts with the named-snippet model, so Svelte requires an explicitly named snippet instead. Thrown at runtime in DEV.

Source

Thrown at packages/svelte/src/internal/shared/errors.js:34

		throw error;
	} else {
		throw new Error(`https://svelte.dev/e/experimental_async_required`);
	}
}

/**
 * Cannot use `{@render children(...)}` if the parent component uses `let:` directives. Consider using a named snippet instead
 * @returns {never}
 */
export function invalid_default_snippet() {
	if (DEV) {
		const error = new Error(`invalid_default_snippet\nCannot use \`{@render children(...)}\` if the parent component uses \`let:\` directives. Consider using a named snippet instead\nhttps://svelte.dev/e/invalid_default_snippet`);

		error.name = 'Svelte error';

		throw error;
	} else {
		throw new Error(`https://svelte.dev/e/invalid_default_snippet`);
	}
}

/**
 * A snippet function was passed invalid arguments. Snippets should only be instantiated via `{@render ...}`
 * @returns {never}
 */
export function invalid_snippet_arguments() {
	if (DEV) {
		const error = new Error(`invalid_snippet_arguments\nA snippet function was passed invalid arguments. Snippets should only be instantiated via \`{@render ...}\`\nhttps://svelte.dev/e/invalid_snippet_arguments`);

		error.name = 'Svelte error';

		throw error;
	} else {
		throw new Error(`https://svelte.dev/e/invalid_snippet_arguments`);
	}
}

View on GitHub (pinned to 20b341f100)

Solutions

1. Replace `let:` directives with a named snippet: define `{#snippet named(data)}` and render with `{@render named(...)}`.
2. Migrate the parent fully off `let:` — pass data via regular props.
3. Keep the slot-to-snippet migration atomic per component so `let:` and `children` render never coexist.

Example fix

<!-- before -->
<!-- Parent.svelte -->
<List items={xs} let:item>{item.name}</List>
<!-- List.svelte -->
{@render children(...)}
<!-- after -->
<!-- Parent.svelte -->
<List items={xs}>{#snippet row(item)}{item.name}{/snippet}</List>
<!-- List.svelte -->
{@render row(...)}

When it happens

Trigger: A parent passes content via `let:` (slot props) while the child renders `{@render children(...)}` — mixing the legacy `let:` directive with snippet rendering in the same component relationship.

Common situations: Migrating Svelte 4 slot components to Svelte 5 snippets piecemeal; a child that uses `{@render children()}` while a parent still uses `<Child let:data={data}>`.

Related errors

• This migration would change the name of a slot (${slot_name}
• This migration would change the name of a slot (${name} to $
• snippet_without_render_tag
• 'svelte/compiler' no longer exports a `walk` utility — pleas
• migrating this component would require adding a `$${rune}` r

AI-assisted analysis of sveltejs/svelte@20b341f100 (2026-08-12). Data as JSON: /api/errors/6edfa2330073398a. Report an issue: GitHub.