add todo

Author: teemingc

apps/svelte.dev/content/docs/kit/10-getting-started/30-project-structure.md

@@ -5,7 +5,7 @@ title: Project structure
 
 A typical SvelteKit project looks like this:
 
-```bash
+```tree
 my-project/
 ├ src/
 │ ├ lib/

apps/svelte.dev/content/docs/kit/20-core-concepts/30-form-actions.md

@@ -470,6 +470,7 @@ Note that you need to `deserialize` the response before processing it further us
 If you have a `+server.js` alongside your `+page.server.js`, `fetch` requests will be routed there by default. To `POST` to an action in `+page.server.js` instead, use the custom `x-sveltekit-action` header:
 
 ```js
+// @errors: 2532 2304
 const response = await fetch(this.action, {
 	method: 'POST',
 	body: data,

apps/svelte.dev/content/docs/kit/25-build-and-deploy/40-adapter-node.md

@@ -11,14 +11,16 @@ Install with `npm i -D @sveltejs/adapter-node`, then add the adapter to your `sv
 
 ```js
 // @errors: 2307
-/// file: svelte.config.js
 import adapter from '@sveltejs/adapter-node';
 
-export default {
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		adapter: adapter()
 	}
 };
+
+export default config;
 ```
 
 ## Deploying
@@ -65,21 +67,21 @@ node +++--env-file=.env+++ build
 
 By default, the server will accept connections on `0.0.0.0` using port 3000. These can be customised with the `PORT` and `HOST` environment variables:
 
-```
+```bash
 HOST=127.0.0.1 PORT=4000 node build
 ```
 
 Alternatively, the server can be configured to accept connections on a specified socket path. When this is done using the `SOCKET_PATH` environment variable, the `HOST` and `PORT` environment variables will be disregarded.
 
-```
+```bash
 SOCKET_PATH=/tmp/socket node build
 ```
 
 ### `ORIGIN`, `PROTOCOL_HEADER`, `HOST_HEADER`, and `PORT_HEADER`
 
 HTTP doesn't give SvelteKit a reliable way to know the URL that is currently being requested. The simplest way to tell SvelteKit where the app is being served is to set the `ORIGIN` environment variable:
 
-```
+```bash
 ORIGIN=https://my.site node build
 
 # or e.g. for local previewing and testing
@@ -88,7 +90,7 @@ ORIGIN=http://localhost:3000 node build
 
 With this, a request for the `/stuff` pathname will correctly resolve to `https://my.site/stuff`. Alternatively, you can specify headers that tell SvelteKit about the request protocol and host, from which it can construct the origin URL:
 
-```
+```bash
 PROTOCOL_HEADER=x-forwarded-proto HOST_HEADER=x-forwarded-host node build
 ```
 
@@ -104,7 +106,7 @@ If `adapter-node` can't correctly determine the URL of your deployment, you may
 
 The [`RequestEvent`](@sveltejs-kit#RequestEvent) object passed to hooks and endpoints includes an `event.getClientAddress()` function that returns the client's IP address. By default this is the connecting `remoteAddress`. If your server is behind one or more proxies (such as a load balancer), this value will contain the innermost proxy's IP address rather than the client's, so we need to specify an `ADDRESS_HEADER` to read the address from:
 
-```
+```bash
 ADDRESS_HEADER=True-Client-IP node build
 ```
 
@@ -147,7 +149,8 @@ The adapter can be configured with various options:
 /// file: svelte.config.js
 import adapter from '@sveltejs/adapter-node';
 
-export default {
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		adapter: adapter({
 			// default options are shown
@@ -157,6 +160,8 @@ export default {
 		})
 	}
 };
+
+export default config;
 ```
 
 ### out
@@ -175,7 +180,7 @@ If you need to change the name of the environment variables used to configure th
 envPrefix: 'MY_CUSTOM_';
 ```
 
-```sh
+```bash
 MY_CUSTOM_HOST=127.0.0.1 \
 MY_CUSTOM_PORT=4000 \
 MY_CUSTOM_ORIGIN=https://my.site \

apps/svelte.dev/content/docs/kit/25-build-and-deploy/50-adapter-static.md

@@ -12,11 +12,11 @@ This will prerender your entire site as a collection of static files. If you'd l
 Install with `npm i -D @sveltejs/adapter-static`, then add the adapter to your `svelte.config.js`:
 
 ```js
-// @errors: 2307
 /// file: svelte.config.js
 import adapter from '@sveltejs/adapter-static';
 
-export default {
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		adapter: adapter({
 			// default options are shown. On some platforms
@@ -29,6 +29,8 @@ export default {
 		})
 	}
 };
+
+export default config;
 ```
 
 ...and add the [`prerender`](page-options#prerender) option to your root layout:
@@ -50,13 +52,17 @@ Some platforms have zero-config support (more to come in future):
 On these platforms, you should omit the adapter options so that `adapter-static` can provide the optimal configuration:
 
 ```js
-// @errors: 2304
 /// file: svelte.config.js
-export default {
+import adapter from '@sveltejs/adapter-static';
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		adapter: adapter(---{...}---)
 	}
 };
+
+export default config;
 ```
 
 ## Options
@@ -90,7 +96,7 @@ You'll also want to generate a fallback `404.html` page to replace the default 4
 A config for GitHub Pages might look like the following:
 
 ```js
-// @errors: 2307 2322
+// @errors: 2322
 /// file: svelte.config.js
 import adapter from '@sveltejs/adapter-static';
 

apps/svelte.dev/content/docs/kit/25-build-and-deploy/55-single-page-apps.md

@@ -19,17 +19,19 @@ If you don't have any server-side logic (i.e. `+page.server.js`, `+layout.server
 Install with `npm i -D @sveltejs/adapter-static`, then add the adapter to your `svelte.config.js` with the following options:
 
 ```js
-// @errors: 2307
 /// file: svelte.config.js
 import adapter from '@sveltejs/adapter-static';
 
-export default {
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		adapter: adapter({
 			fallback: '200.html' // may differ from host to host
 		})
 	}
 };
+
+export default config;
 ```
 
 The `fallback` page is an HTML page created by SvelteKit from your page template (e.g. `app.html`) that loads your app and navigates to the correct route. For example [Surge](https://surge.sh/help/adding-a-200-page-for-client-side-routing), a static web host, lets you add a `200.html` file that will handle any requests that don't correspond to static assets or prerendered pages.

apps/svelte.dev/content/docs/kit/25-build-and-deploy/60-adapter-cloudflare.md

@@ -21,7 +21,8 @@ Install with `npm i -D @sveltejs/adapter-cloudflare`, then add the adapter to yo
 /// file: svelte.config.js
 import adapter from '@sveltejs/adapter-cloudflare';
 
-export default {
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		adapter: adapter({
 			// See below for an explanation of these options
@@ -39,6 +40,8 @@ export default {
 		})
 	}
 };
+
+export default config;
 ```
 
 ## Options
@@ -126,9 +129,25 @@ Functions contained in the [`/functions` directory](https://developers.cloudflar
 The [`env`](https://developers.cloudflare.com/workers/runtime-apis/fetch-event#parameters) object contains your project's [bindings](https://developers.cloudflare.com/workers/runtime-apis/bindings/), which consist of KV/DO namespaces, etc. It is passed to SvelteKit via the `platform` property, along with [`context`](https://developers.cloudflare.com/workers/runtime-apis/context/), [`caches`](https://developers.cloudflare.com/workers/runtime-apis/cache/), and [`cf`](https://developers.cloudflare.com/workers/runtime-apis/request/#incomingrequestcfproperties), meaning that you can access it in hooks and endpoints:
 
 ```js
-// @errors: 7031
+// @filename: ambient.d.ts
+import { DurableObjectNamespace } from '@cloudflare/workers-types';
+
+declare global {
+	namespace App {
+		interface Platform {
+			env: {
+				YOUR_DURABLE_OBJECT_NAMESPACE: DurableObjectNamespace;
+			};
+		}
+	}
+}
+// @filename: +server.js
+// ---cut---
+// @errors: 2355 2322
+/// file: +server.js
+/** @type {import('./$types').RequestHandler} */
 export async function POST({ request, platform }) {
-	const x = platform.env.YOUR_DURABLE_OBJECT_NAMESPACE.idFromName('x');
+	const x = platform?.env.YOUR_DURABLE_OBJECT_NAMESPACE.idFromName('x');
 }
 ```
 
@@ -143,7 +162,7 @@ To make these types available to your app, install [`@cloudflare/workers-types`]
 declare global {
 	namespace App {
 		interface Platform {
-+++			env?: {
++++			env: {
 				YOUR_KV_NAMESPACE: KVNamespace;
 				YOUR_DURABLE_OBJECT_NAMESPACE: DurableObjectNamespace;
 			};+++
@@ -194,15 +213,19 @@ Cloudflare no longer recommends using [Workers Sites](https://developers.cloudfl
 ### svelte.config.js
 
 ```js
+// @errors: 2307
 /// file: svelte.config.js
 ---import adapter from '@sveltejs/adapter-cloudflare-workers';---
 +++import adapter from '@sveltejs/adapter-cloudflare';+++
 
-export default {
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		adapter: adapter()
 	}
 };
+
+export default config;
 ```
 
 ### wrangler.toml

apps/svelte.dev/content/docs/kit/25-build-and-deploy/70-adapter-cloudflare-workers.md

@@ -16,13 +16,16 @@ Install with `npm i -D @sveltejs/adapter-cloudflare-workers`, then add the adapt
 /// file: svelte.config.js
 import adapter from '@sveltejs/adapter-cloudflare-workers';
 
-export default {
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		adapter: adapter({
 			// see below for options that can be set here
 		})
 	}
 };
+
+export default config;
 ```
 
 ## Options
@@ -65,14 +68,14 @@ https://dash.cloudflare.com/<your-account-id>/home
 
 You will need to install [Wrangler](https://developers.cloudflare.com/workers/wrangler/install-and-update/) and log in, if you haven't already:
 
-```sh
+```bash
 npm i -D wrangler
 wrangler login
 ```
 
 Then, you can build your app and deploy it:
 
-```sh
+```bash
 wrangler deploy
 ```
 
@@ -81,9 +84,25 @@ wrangler deploy
 The [`env`](https://developers.cloudflare.com/workers/runtime-apis/fetch-event#parameters) object contains your project's [bindings](https://developers.cloudflare.com/workers/runtime-apis/bindings/), which consist of KV/DO namespaces, etc. It is passed to SvelteKit via the `platform` property, along with [`context`](https://developers.cloudflare.com/workers/runtime-apis/context/), [`caches`](https://developers.cloudflare.com/workers/runtime-apis/cache/), and [`cf`](https://developers.cloudflare.com/workers/runtime-apis/request/#incomingrequestcfproperties), meaning that you can access it in hooks and endpoints:
 
 ```js
-// @errors: 7031
+// @filename: ambient.d.ts
+import { DurableObjectNamespace } from '@cloudflare/workers-types';
+
+declare global {
+	namespace App {
+		interface Platform {
+			env: {
+				YOUR_DURABLE_OBJECT_NAMESPACE: DurableObjectNamespace;
+			};
+		}
+	}
+}
+// @filename: +server.js
+// ---cut---
+// @errors: 2355 2322
+/// file: +server.js
+/** @type {import('./$types').RequestHandler} */
 export async function POST({ request, platform }) {
-	const x = platform.env.YOUR_DURABLE_OBJECT_NAMESPACE.idFromName('x');
+	const x = platform?.env.YOUR_DURABLE_OBJECT_NAMESPACE.idFromName('x');
 }
 ```
 

apps/svelte.dev/content/docs/kit/25-build-and-deploy/80-adapter-netlify.md

@@ -12,11 +12,11 @@ This adapter will be installed by default when you use [`adapter-auto`](adapter-
 Install with `npm i -D @sveltejs/adapter-netlify`, then add the adapter to your `svelte.config.js`:
 
 ```js
-// @errors: 2307
 /// file: svelte.config.js
 import adapter from '@sveltejs/adapter-netlify';
 
-export default {
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		// default options are shown
 		adapter: adapter({
@@ -31,6 +31,8 @@ export default {
 		})
 	}
 };
+
+export default config;
 ```
 
 Then, make sure you have a [netlify.toml](https://docs.netlify.com/configure-builds/file-based-configuration) file in the project root. This will determine where to write static assets based on the `build.publish` settings, as per this sample configuration:
@@ -52,11 +54,11 @@ New projects will use the current Node LTS version by default. However, if you'r
 SvelteKit supports [Netlify Edge Functions](https://docs.netlify.com/netlify-labs/experimental-features/edge-functions/). If you pass the option `edge: true` to the `adapter` function, server-side rendering will happen in a Deno-based edge function that's deployed close to the site visitor. If set to `false` (the default), the site will deploy to Node-based Netlify Functions.
 
 ```js
-// @errors: 2307
 /// file: svelte.config.js
 import adapter from '@sveltejs/adapter-netlify';
 
-export default {
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
 	kit: {
 		adapter: adapter({
 			// will create a Netlify Edge Function using Deno-based
@@ -65,6 +67,8 @@ export default {
 		})
 	}
 };
+
+export default config;
 ```
 
 ## Netlify alternatives to SvelteKit functionality
@@ -93,10 +97,14 @@ During compilation, redirect rules are automatically appended to your `_redirect
 With this adapter, SvelteKit endpoints are hosted as [Netlify Functions](https://docs.netlify.com/functions/overview/). Netlify function handlers have additional context, including [Netlify Identity](https://docs.netlify.com/visitor-access/identity/) information. You can access this context via the `event.platform.context` field inside your hooks and `+page.server` or `+layout.server` endpoints. These are [serverless functions](https://docs.netlify.com/functions/overview/) when the `edge` property is `false` in the adapter config or [edge functions](https://docs.netlify.com/edge-functions/overview/#app) when it is `true`.
 
 ```js
-// @errors: 2705 7006
+// @filename: ambient.d.ts
+/// <reference types="@sveltejs/adapter-netlify" />
+// @filename: +page.server.js
+// ---cut---
 /// file: +page.server.js
+/** @type {import('./$types').PageServerLoad} */
 export const load = async (event) => {
-	const context = event.platform.context;
+	const context = event.platform?.context;
 	console.log(context); // shows up in your functions log in the Netlify app
 };
 ```