← Back to patterns
Dynamic Import (No # Syntax Test)
Testing if {await import()} works without the # symbol
Pattern Comparison:
With # (Standard)
{#await import('./component.svelte')}
<p>Loading...</p>
{:then { default: Component }}
<Component />
{/await}
Without # (Test)
{await import('./component.svelte') then { default: Component }}
<Component />
{/await}
Test 1: Standard {#await} syntax
Loading component with {#await} syntax...
Test 2: Without # syntax (experimental)
Note: The syntax {await}
without # is not valid in Svelte 5. The #
is required for block statements like await, if, each, etc.
If this code compiles, it would be displayed below. Otherwise, you'll see a compiler error in the console.
✗ Syntax {await} without # is invalid in Svelte 5
Block statements require the # prefix. Use {#await} instead.
Conclusion: Svelte 5 requires the #
prefix for all block statements including {#await}
, {#if}
, and {#each}
. The syntax without #
is not valid and will cause a compiler error.
Always use {#await}
for dynamic imports and async
operations.