Skip to content

Commit f5e9142

Browse files
Sync kit docs (sveltejs#1135)
sync kit docs Co-authored-by: svelte-docs-bot[bot] <196124396+svelte-docs-bot[bot]@users.noreply.github.com>
1 parent f71b1c6 commit f5e9142

File tree

5 files changed

+68
-16
lines changed

5 files changed

+68
-16
lines changed

apps/svelte.dev/content/docs/kit/20-core-concepts/10-routing.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,8 @@ A `+page.svelte` component defines a page of your app. By default, pages are ren
3838
<a href="/">Home</a>
3939
```
4040

41+
> [!NOTE] SvelteKit uses `<a>` elements to navigate between routes, rather than a framework-specific `<Link>` component.
42+
4143
Pages can receive data from `load` functions via the `data` prop.
4244

4345
```svelte
@@ -56,8 +58,6 @@ Pages can receive data from `load` functions via the `data` prop.
5658
>
5759
> In Svelte 4, you'd use `export let data` instead.
5860
59-
> [!NOTE] SvelteKit uses `<a>` elements to navigate between routes, rather than a framework-specific `<Link>` component.
60-
6161
### +page.js
6262

6363
Often, a page will need to load some data before it can be rendered. For this, we add a `+page.js` module that exports a `load` function:

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -354,7 +354,7 @@ The easiest way to progressively enhance a form is to add the `use:enhance` acti
354354
<form method="POST" +++use:enhance+++>
355355
```
356356
357-
> [!NOTE] `use:enhance` can only be used with forms that have `method="POST"`. It will not work with `method="GET"`, which is the default for forms without a specified method. Attempting to use `use:enhance` on forms without `method="POST"` will result in an error.
357+
> [!NOTE] `use:enhance` can only be used with forms that have `method="POST"` and point to actions defined in a `+page.server.js` file. It will not work with `method="GET"`, which is the default for forms without a specified method. Attempting to use `use:enhance` on forms without `method="POST"` or posting to a `+server.js` endpoint will result in an error.
358358
359359
> [!NOTE] Yes, it's a little confusing that the `enhance` action and `<form action>` are both called 'action'. These docs are action-packed. Sorry.
360360

apps/svelte.dev/content/docs/kit/60-appendix/30-migrating-to-sveltekit-2.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ The `$env/dynamic/public` and `$env/dynamic/private` modules provide access to _
130130

131131
During prerendering in SvelteKit 1, they are one and the same. As such, prerendered pages that make use of 'dynamic' environment variables are really 'baking in' build time values, which is incorrect. Worse, `$env/dynamic/public` is populated in the browser with these stale values if the user happens to land on a prerendered page before navigating to dynamically-rendered pages.
132132

133-
Because of this, dynamic environment variables can no longer be read during prerendering in SvelteKit 2 — you should use the `static` modules instead. If the user lands on a prerendered page, SvelteKit will request up-to-date values for `$env/dynamic/public` from the server (by default from a module called `_env.js` — this can be configured with `config.kit.env.publicModule`) instead of reading them from the server-rendered HTML.
133+
Because of this, dynamic environment variables can no longer be read during prerendering in SvelteKit 2 — you should use the `static` modules instead. If the user lands on a prerendered page, SvelteKit will request up-to-date values for `$env/dynamic/public` from the server (by default from a module called `/_app/env.js`) instead of reading them from the server-rendered HTML.
134134

135135
## `form` and `data` have been removed from `use:enhance` callbacks
136136

apps/svelte.dev/content/docs/kit/98-reference/50-configuration.md

+35
Original file line numberDiff line numberDiff line change
@@ -1085,6 +1085,41 @@ What type of client-side router to use.
10851085
- `'hash'` means the route is determined by `location.hash`. In this case, SSR and prerendering are disabled. This is only recommended if `pathname` is not an option, for example because you don't control the webserver where your app is deployed.
10861086
It comes with some caveats: you can't use server-side rendering (or indeed any server logic), and you have to make sure that the links in your app all start with #/, or they won't work. Beyond that, everything works exactly like a normal SvelteKit app.
10871087

1088+
</div>
1089+
</div>
1090+
<div class="ts-block-property">
1091+
1092+
```ts
1093+
// @noErrors
1094+
resolution?: 'client' | 'server';
1095+
```
1096+
1097+
<div class="ts-block-property-details">
1098+
1099+
<div class="ts-block-property-bullets">
1100+
1101+
- <span class="tag">default</span> `"client"`
1102+
- <span class="tag since">available since</span> v2.17.0
1103+
1104+
</div>
1105+
1106+
How to determine which route to load when navigating to a new page.
1107+
1108+
By default, SvelteKit will serve a route manifest to the browser.
1109+
When navigating, this manifest is used (along with the `reroute` hook, if it exists) to determine which components to load and which `load` functions to run.
1110+
Because everything happens on the client, this decision can be made immediately. The drawback is that the manifest needs to be
1111+
loaded and parsed before the first navigation can happen, which may have an impact if your app contains many routes.
1112+
1113+
Alternatively, SvelteKit can determine the route on the server. This means that for every navigation to a path that has not yet been visited, the server will be asked to determine the route.
1114+
This has several advantages:
1115+
- The client does not need to load the routing manifest upfront, which can lead to faster initial page loads
1116+
- The list of routes is hidden from public view
1117+
- The server has an opportunity to intercept each navigation (for example through a middleware), enabling (for example) A/B testing opaque to SvelteKit
1118+
1119+
The drawback is that for unvisited paths, resolution will take slightly longer (though this is mitigated by [preloading](/docs/kit/link-options#data-sveltekit-preload-data)).
1120+
1121+
> [!NOTE] When using server-side route resolution and prerendering, the resolution is prerendered along with the route itself.
1122+
10881123
</div>
10891124
</div>
10901125

apps/svelte.dev/content/docs/kit/98-reference/54-types.md

+29-12
Original file line numberDiff line numberDiff line change
@@ -128,15 +128,34 @@ The generated `.svelte-kit/tsconfig.json` file contains a mixture of options. So
128128
/// file: .svelte-kit/tsconfig.json
129129
{
130130
"compilerOptions": {
131-
"baseUrl": "..",
132131
"paths": {
133-
"$lib": "src/lib",
134-
"$lib/*": "src/lib/*"
132+
"$lib": ["../src/lib"],
133+
"$lib/*": ["../src/lib/*"]
135134
},
136135
"rootDirs": ["..", "./types"]
137136
},
138-
"include": ["../src/**/*.js", "../src/**/*.ts", "../src/**/*.svelte"],
139-
"exclude": ["../node_modules/**", "./**"]
137+
"include": [
138+
"ambient.d.ts",
139+
"non-ambient.d.ts",
140+
"./types/**/$types.d.ts",
141+
"../vite.config.js",
142+
"../vite.config.ts",
143+
"../src/**/*.js",
144+
"../src/**/*.ts",
145+
"../src/**/*.svelte",
146+
"../tests/**/*.js",
147+
"../tests/**/*.ts",
148+
"../tests/**/*.svelte"
149+
],
150+
"exclude": [
151+
"../node_modules/**",
152+
"../src/service-worker.js",
153+
"../src/service-worker/**/*.js",
154+
"../src/service-worker.ts",
155+
"../src/service-worker/**/*.ts",
156+
"../src/service-worker.d.ts",
157+
"../src/service-worker/**/*.d.ts"
158+
]
140159
}
141160
```
142161
@@ -148,24 +167,22 @@ Others are required for SvelteKit to work properly, and should also be left unto
148167
"compilerOptions": {
149168
// this ensures that types are explicitly
150169
// imported with `import type`, which is
151-
// necessary as svelte-preprocess cannot
170+
// necessary as Svelte/Vite cannot
152171
// otherwise compile components correctly
153-
"importsNotUsedAsValues": "error",
172+
"verbatimModuleSyntax": true,
154173

155174
// Vite compiles one TypeScript module
156175
// at a time, rather than compiling
157176
// the entire module graph
158177
"isolatedModules": true,
159178

160-
// TypeScript cannot 'see' when you
161-
// use an imported value in your
162-
// markup, so we need this
163-
"preserveValueImports": true,
179+
// Tell TS it's used only for type-checking
180+
"noEmit": true,
164181

165182
// This ensures both `vite build`
166183
// and `svelte-package` work correctly
167184
"lib": ["esnext", "DOM", "DOM.Iterable"],
168-
"moduleResolution": "node",
185+
"moduleResolution": "bundler",
169186
"module": "esnext",
170187
"target": "esnext"
171188
}

0 commit comments

Comments
 (0)