Update SvelteKit (#197)

- Updates the project with SvelteKit's new router. - Enable the use of Vercel Edge Functions. - Make use of the new page endpoints, which split off `load` functions to a separate file. - Enabled prerendering by default on all pages. - Refactored the blog posts system to be much more concise and clear (using said page endpoints) - Fixed some typescript errors. - Update deps.
mstrow · Aug 26, 2022 · 0f4dabe · 0f4dabe
1 parent d640fdd
commit 0f4dabe
Show file tree

Hide file tree

Showing 47 changed files with 1,549 additions and 1,000 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,7 +1,7 @@
 .DS_Store
 node_modules
-/.svelte-kit
+.svelte-kit
 /package
-/.idea
-/build
-/.netlify
+.idea
+build
+/.vercel
diff --git a/README.md b/README.md
@@ -112,7 +112,11 @@ Our documentation system uses [mdsvex](https://mdsvex.pngwn.io/), a superset of
 
 ### Editing Existing Pages
 
-Documentation files are located at [`src/routes/docs`](https://github.com/files-community/Website/tree/main/src/routes/docs). SvelteKit uses a filesystem-based router, meaning that the layout of pages in the filesystem will reflect the URL path they are compiled to. To edit an existing page, find the corresponding `*.md` file in the [`docs`](<(https://github.com/files-community/Website/tree/main/src/routes/docs)>) directory.
+Documentation files are located
+at [`src/routes/docs`](https://github.com/files-community/Website/tree/main/src/routes/docs). SvelteKit uses a
+filesystem-based router, meaning that the layout of page folders in the filesystem will reflect the URL path they are
+compiled to. To edit an existing page, find the corresponding `*.md` file in
+the [`docs`](<(https://github.com/files-community/Website/tree/main/src/routes/docs)>) directory.
 
 ### Adding or Deleting a Page
 
@@ -124,11 +128,15 @@ This is an example docs mapping:
 
 ```
 .
-├──page-1.md
-├──page-2.md
+├──page-1
+│   └──+page.md
+├──page-2
+│   └──+page.md
 └──category
-    ├──category-page-1.md
-    └──category-page-2.md
+    ├──category-page-1
+    │   └──+page.md
+    └──category-page-2
+        └──+page.md
 ```
 
 #### src/data/docs.ts
@@ -144,7 +152,6 @@ This is an example docs mapping:
 		path: "/page-2"
 	},
 	{
-		type: "category",
 		name: "Nested Category",
 		pages: [
 			{
@@ -162,11 +169,17 @@ This is an example docs mapping:
 
 ## Using the Blog
 
-Similarly to docs pages, the blog also uses [mdsvex](https://mdsvex.pngwn.io/) for it's markdown. Blog posts are located at [`src/routes/blog/posts`](https://github.com/files-community/Website/tree/main/src/blog/posts) in `*.md` files. Unlike the docs, a mapping of blog posts doesn't need to be kept.
+Similarly to docs pages, the blog also uses [mdsvex](https://mdsvex.pngwn.io/) for it's markdown. Blog posts are located
+at [`src/routes/blog/posts`](https://github.com/files-community/Website/tree/main/src/blog/posts) in `*.md` files.
+Unlike the docs, a mapping of blog posts doesn't need to be kept.
 
 ### Publishing a Post
 
-To publish a post, create a new `.md` file in the [`posts`](https://github.com/files-community/Website/tree/main/src/blog/posts) folder. At the top of a the file, you'll need to include a few required things before typing the post.
+To publish a post, create a new folder in
+the [`posts`](https://github.com/files-community/Website/tree/main/src/blog/posts) folder, and in it place a file
+named `+page.md`. It will contain your post's content.
+
+At the top of the file, you'll need to include a few required things before typing the post.
 
 ```md
 ---

diff --git a/package.json b/package.json
@@ -3,8 +3,8 @@
 	"version": "0.0.1",
 	"repository": "https://github.com/files-community/files",
 	"scripts": {
-		"dev": "svelte-kit dev",
-		"build": "svelte-kit build",
+		"dev": "vite dev",
+		"build": "vite build",
 		"preview": "svelte-kit preview",
 		"check": "svelte-check --tsconfig ./tsconfig.json",
 		"check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
@@ -13,32 +13,33 @@
 	},
 	"devDependencies": {
 		"@fec/remark-a11y-emoji": "^3.1.0",
-		"@fluentui/svg-icons": "^1.1.160",
-		"@neodrag/svelte": "^1.1.3",
-		"@sveltejs/adapter-vercel": "^1.0.0-next.40",
-		"@sveltejs/kit": "^1.0.0-next.260",
-		"@typescript-eslint/eslint-plugin": "^5.11.0",
-		"@typescript-eslint/parser": "^5.11.0",
-		"autoprefixer": "^10.4.2",
-		"cssnano": "^5.0.17",
-		"eslint": "^8.8.0",
-		"eslint-config-prettier": "^8.3.0",
-		"eslint-plugin-svelte3": "^3.4.0",
-		"fluent-svelte": "^1.3.3",
-		"mdsvex": "^0.10.5",
-		"postcss": "^8.4.6",
+		"@fluentui/svg-icons": "^1.1.179",
+		"@neodrag/svelte": "^1.2.3",
+		"@sveltejs/adapter-vercel": "next",
+		"@sveltejs/kit": "next",
+		"@typescript-eslint/eslint-plugin": "^5.35.1",
+		"@typescript-eslint/parser": "^5.35.1",
+		"autoprefixer": "^10.4.8",
+		"cssnano": "^5.1.13",
+		"eslint": "^8.22.0",
+		"eslint-config-prettier": "^8.5.0",
+		"eslint-plugin-svelte3": "^3.4.1",
+		"fluent-svelte": "^1.6.0",
+		"mdsvex": "^0.10.6",
+		"postcss": "^8.4.16",
 		"postcss-media-minmax": "^5.0.0",
-		"prettier": "^2.5.1",
-		"prettier-plugin-svelte": "^2.6.0",
+		"prettier": "^2.7.1",
+		"prettier-plugin-svelte": "^2.7.0",
 		"remark-gfm": "^3.0.1",
-		"remark-github": "^11.2.2",
+		"remark-github": "^11.2.4",
 		"remark-slug": "^7.0.1",
-		"sass": "^1.49.7",
-		"svelte": "^3.46.4",
-		"svelte-check": "^2.4.3",
-		"svelte-preprocess": "^4.10.2",
-		"tslib": "^2.3.1",
-		"typescript": "^4.5.5"
+		"sass": "^1.54.5",
+		"svelte": "^3.49.0",
+		"svelte-check": "^2.8.1",
+		"svelte-preprocess": "^4.10.7",
+		"tslib": "^2.4.0",
+		"typescript": "^4.8.2",
+		"vite": "^3.0.9"
 	},
 	"type": "module"
 }