Skip to content

Commit 6d2215a

Browse files
committed
Upgrade to SvelteKit v2
1 parent 1d80bfa commit 6d2215a

22 files changed

+15177
-15148
lines changed

jsconfig.json

Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,18 @@
11
{
2-
"extends": "./.svelte-kit/tsconfig.json",
3-
"compilerOptions": {
4-
"allowJs": true,
5-
"checkJs": true,
6-
"esModuleInterop": true,
7-
"forceConsistentCasingInFileNames": true,
8-
"resolveJsonModule": true,
9-
"skipLibCheck": true,
10-
"sourceMap": true,
11-
"strict": true
12-
}
13-
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias and https://kit.svelte.dev/docs/configuration#files
14-
//
15-
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
16-
// from the referenced tsconfig.json - TypeScript does not merge them in
2+
"extends": "./.svelte-kit/tsconfig.json",
3+
"compilerOptions": {
4+
"allowJs": true,
5+
"checkJs": true,
6+
"esModuleInterop": true,
7+
"forceConsistentCasingInFileNames": true,
8+
"resolveJsonModule": true,
9+
"skipLibCheck": true,
10+
"sourceMap": true,
11+
"strict": true,
12+
"moduleResolution": "bundler",
13+
},
14+
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias and https://kit.svelte.dev/docs/configuration#files
15+
//
16+
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
17+
// from the referenced tsconfig.json - TypeScript does not merge them in
1718
}

package-lock.json

Lines changed: 1091 additions & 1201 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,20 @@
33
"scripts": {
44
"dev": "vite dev",
55
"build": "vite build",
6-
"preview": "vite preview"
6+
"preview": "vite preview",
7+
"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
8+
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch"
79
},
810
"devDependencies": {
911
"@fontsource/fira-mono": "^4.5.10",
1012
"@neoconfetti/svelte": "^1.0.0",
11-
"@sveltejs/adapter-node": "^1.3.1",
12-
"@sveltejs/kit": "^1.27.4",
13-
"@types/cookie": "^0.5.4",
14-
"svelte": "^4.2.3",
15-
"vite": "^4.5.0"
13+
"@sveltejs/adapter-node": "^4.0.1",
14+
"@sveltejs/kit": "^2.5.0",
15+
"@sveltejs/vite-plugin-svelte": "^3.0.2",
16+
"svelte": "^4.2.9",
17+
"svelte-check": "^3.6.3",
18+
"typescript": "^5.3.3",
19+
"vite": "^5.0.3"
1620
},
1721
"type": "module"
1822
}

render.yaml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,4 @@ services:
44
env: node
55
buildCommand: npm install && npm run build
66
startCommand: node build/index.js
7-
autoDeploy: false
7+
autoDeploy: false

src/app.d.ts

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,13 @@
11
// See https://kit.svelte.dev/docs/types#app
22
// for information about these interfaces
3-
// and what to do when importing types
4-
declare namespace App {}
3+
declare global {
4+
namespace App {
5+
// interface Error {}
6+
// interface Locals {}
7+
// interface PageData {}
8+
// interface PageState {}
9+
// interface Platform {}
10+
}
11+
}
12+
13+
export {};

src/app.html

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html lang="en">
3-
<head>
4-
<meta charset="utf-8" />
5-
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
6-
<meta name="viewport" content="width=device-width" />
7-
%sveltekit.head%
8-
</head>
9-
<body data-sveltekit-prefetch>
10-
<div>%sveltekit.body%</div>
11-
</body>
3+
<head>
4+
<meta charset="utf-8" />
5+
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1" />
7+
%sveltekit.head%
8+
</head>
9+
<body data-sveltekit-preload-data="hover">
10+
<div style="display: contents">%sveltekit.body%</div>
11+
</body>
1212
</html>

src/routes/+layout.svelte

Lines changed: 45 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,55 @@
11
<script>
2-
import Header from './Header.svelte';
3-
import './styles.css';
2+
import Header from "./Header.svelte";
3+
import "./styles.css";
44
</script>
55

66
<div class="app">
7-
<Header />
7+
<Header />
88

9-
<main>
10-
<slot />
11-
</main>
9+
<main>
10+
<slot />
11+
</main>
1212

13-
<footer>
14-
<p>visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to learn SvelteKit</p>
15-
</footer>
13+
<footer>
14+
<p>
15+
visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to learn SvelteKit
16+
</p>
17+
</footer>
1618
</div>
1719

1820
<style>
19-
.app {
20-
display: flex;
21-
flex-direction: column;
22-
min-height: 100vh;
23-
}
24-
25-
main {
26-
flex: 1;
27-
display: flex;
28-
flex-direction: column;
29-
padding: 1rem;
30-
width: 100%;
31-
max-width: 64rem;
32-
margin: 0 auto;
33-
box-sizing: border-box;
34-
}
35-
36-
footer {
37-
display: flex;
38-
flex-direction: column;
39-
justify-content: center;
40-
align-items: center;
41-
padding: 12px;
42-
}
43-
44-
footer a {
45-
font-weight: bold;
46-
}
47-
48-
@media (min-width: 480px) {
49-
footer {
50-
padding: 12px 0;
51-
}
52-
}
21+
.app {
22+
display: flex;
23+
flex-direction: column;
24+
min-height: 100vh;
25+
}
26+
27+
main {
28+
flex: 1;
29+
display: flex;
30+
flex-direction: column;
31+
padding: 1rem;
32+
width: 100%;
33+
max-width: 64rem;
34+
margin: 0 auto;
35+
box-sizing: border-box;
36+
}
37+
38+
footer {
39+
display: flex;
40+
flex-direction: column;
41+
justify-content: center;
42+
align-items: center;
43+
padding: 12px;
44+
}
45+
46+
footer a {
47+
font-weight: bold;
48+
}
49+
50+
@media (min-width: 480px) {
51+
footer {
52+
padding: 12px 0;
53+
}
54+
}
5355
</style>

src/routes/+page.svelte

Lines changed: 48 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,59 +1,59 @@
11
<script>
2-
import Counter from './Counter.svelte';
3-
import welcome from '$lib/images/svelte-welcome.webp';
4-
import welcome_fallback from '$lib/images/svelte-welcome.png';
2+
import Counter from "./Counter.svelte";
3+
import welcome from "$lib/images/svelte-welcome.webp";
4+
import welcome_fallback from "$lib/images/svelte-welcome.png";
55
</script>
66

77
<svelte:head>
8-
<title>Home</title>
9-
<meta name="description" content="Svelte demo app" />
8+
<title>Home</title>
9+
<meta name="description" content="Svelte demo app" />
1010
</svelte:head>
1111

1212
<section>
13-
<h1>
14-
<span class="welcome">
15-
<picture>
16-
<source srcset={welcome} type="image/webp" />
17-
<img src={welcome_fallback} alt="Welcome" />
18-
</picture>
19-
</span>
20-
21-
to your new<br />SvelteKit app
22-
</h1>
23-
24-
<h2>
25-
try editing <strong>src/routes/+page.svelte</strong>
26-
</h2>
27-
28-
<Counter />
13+
<h1>
14+
<span class="welcome">
15+
<picture>
16+
<source srcset={welcome} type="image/webp" />
17+
<img src={welcome_fallback} alt="Welcome" />
18+
</picture>
19+
</span>
20+
21+
to your new<br />SvelteKit app
22+
</h1>
23+
24+
<h2>
25+
try editing <strong>src/routes/+page.svelte</strong>
26+
</h2>
27+
28+
<Counter />
2929
</section>
3030

3131
<style>
32-
section {
33-
display: flex;
34-
flex-direction: column;
35-
justify-content: center;
36-
align-items: center;
37-
flex: 0.6;
38-
}
39-
40-
h1 {
41-
width: 100%;
42-
}
43-
44-
.welcome {
45-
display: block;
46-
position: relative;
47-
width: 100%;
48-
height: 0;
49-
padding: 0 0 calc(100% * 495 / 2048) 0;
50-
}
51-
52-
.welcome img {
53-
position: absolute;
54-
width: 100%;
55-
height: 100%;
56-
top: 0;
57-
display: block;
58-
}
32+
section {
33+
display: flex;
34+
flex-direction: column;
35+
justify-content: center;
36+
align-items: center;
37+
flex: 0.6;
38+
}
39+
40+
h1 {
41+
width: 100%;
42+
}
43+
44+
.welcome {
45+
display: block;
46+
position: relative;
47+
width: 100%;
48+
height: 0;
49+
padding: 0 0 calc(100% * 495 / 2048) 0;
50+
}
51+
52+
.welcome img {
53+
position: absolute;
54+
width: 100%;
55+
height: 100%;
56+
top: 0;
57+
display: block;
58+
}
5959
</style>

0 commit comments

Comments
 (0)