Skip to main content
App.svelte
BlueThing.svelte
GreenThing.svelte
RedThing.svelte
<script>
	import RedThing from './RedThing.svelte';
	import GreenThing from './GreenThing.svelte';
	import BlueThing from './BlueThing.svelte';

	const options = [
		{ color: 'red',   component: RedThing   },
		{ color: 'green', component: GreenThing },
		{ color: 'blue',  component: BlueThing  },
	];

	let selected = options[0];
</script>

<select bind:value={selected}>
	{#each options as option}
		<option value={option}>{option.color}</option>
	{/each}
</select>

<svelte:component this={selected.component}/>
loading editor...

Console

loading Svelte compiler...
 
loading editor...

Compiler options

result = svelte.compile(source, {
generate:
});
 
loading editor...

No AST available

The AST is not public API and may change at any point in time