From 91c20f270124ebe5b94691ef304eb4ebec11e3ef Mon Sep 17 00:00:00 2001
From: Simon Holthausen <simon.holthausen@vercel.com>
Date: Thu, 22 Jun 2023 19:05:31 +0200
Subject: [PATCH] fix

---
 .../blog/2023-02-21-streaming-snapshots-sveltekit.md         | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/documentation/blog/2023-02-21-streaming-snapshots-sveltekit.md b/documentation/blog/2023-02-21-streaming-snapshots-sveltekit.md
index a8f76a4075..49aa05d4ac 100644
--- a/documentation/blog/2023-02-21-streaming-snapshots-sveltekit.md
+++ b/documentation/blog/2023-02-21-streaming-snapshots-sveltekit.md
@@ -18,6 +18,9 @@ Now, in SvelteKit 1.8, we have a new solution: you can return a nested promise f
 For example, consider the following `load` function:
 
 ```ts
+/// file: +page.server.ts
+import type { PageServerLoad } from './$types';
+
 export const load: PageServerLoad = () => {
 	return {
 		post: fetchPost(),
@@ -31,6 +34,7 @@ export const load: PageServerLoad = () => {
 SvelteKit will automatically await the `fetchPost` call before it starts rendering the page, since it’s at the top level. However, it won’t wait for the nested `fetchComments` call to complete – the page will render and `data.streamed.comments` will be a promise that will resolve as the request completes. We can show a loading state in the corresponding `+page.svelte` using Svelte’s [await block](https://svelte.dev/docs#template-syntax-await):
 
 ```svelte
+<!-- file: +page.svelte --->
 <script lang="ts">
 	import type { PageData } from './$types';
 	export let data: PageData;
@@ -132,6 +136,7 @@ Now, you can export a `snapshot` object from a `+page.svelte` or `+layout.svelte
 For example, here is how you would capture and restore the value of a textarea:
 
 ```svelte
+<!-- file: +page.svelte -->
 <script lang="ts">
 	import type { Snapshot } from './$types';