SvelteKit 3

apps/sveltekit/jsconfig.json

@@ -1,18 +1,8 @@
 {
-  "extends": "./.svelte-kit/tsconfig.json",
+  "extends": "$app/tsconfig",
   "compilerOptions": {
-    "allowJs": true,
-    "checkJs": true,
-    "esModuleInterop": true,
-    "forceConsistentCasingInFileNames": true,
-    "resolveJsonModule": true,
-    "skipLibCheck": true,
     "sourceMap": true,
-    "strict": true,
-    "moduleResolution": "bundler"
-  }
-  // Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias and https://kit.svelte.dev/docs/configuration#files
-  //
-  // If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
-  // from the referenced tsconfig.json - TypeScript does not merge them in
+    "strict": true
+  },
+  "include": ["src"]
 }

apps/sveltekit/package.json

@@ -11,13 +11,17 @@
     "preview": "vite preview"
   },
   "devDependencies": {
-    "@sveltejs/adapter-vercel": "latest",
-    "@sveltejs/kit": "latest",
+    "@sveltejs/adapter-vercel": "^7.0.0",
+    "@sveltejs/kit": "^3.0.0",
     "@sveltejs/vite-plugin-svelte": "latest",
     "@vercel/analytics": "workspace:*",
     "svelte": "latest",
     "svelte-check": "latest",
-    "typescript": "latest",
+    "typescript": "^6.0.0",
     "vite": "latest"
+  },
+  "imports": {
+    "#lib": "./src/lib/index.js",
+    "#lib/*": "./src/lib/*"
   }
 }

apps/sveltekit/src/routes/+layout.ts

@@ -2,7 +2,7 @@ import {
   type BeforeSendEvent,
   injectAnalytics,
 } from '@vercel/analytics/sveltekit';
-import { dev } from '$app/environment';
+import { dev } from '$app/env';
 
 injectAnalytics({
   mode: dev ? 'development' : 'production',

apps/sveltekit/src/routes/[slug]/+page.svelte

@@ -1,10 +1,10 @@
 <script>
 import { track } from '@vercel/analytics/sveltekit';
-import { page } from '$app/stores';
+import { page } from '$app/state';
 </script>
 
-<h1>We don't talk about {$page.params.slug}</h1>
+<h1>We don't talk about {page.params.slug}</h1>
 
-<a href="/" onclick={() => track('go-back', { slug: $page.params.slug })}
+<a href="/" onclick={() => track('go-back', { slug: page.params.slug })}
   >Go back</a
 >

apps/sveltekit/vite.config.js

@@ -1,6 +1,7 @@
+import adapter from '@sveltejs/adapter-vercel';
 import { sveltekit } from '@sveltejs/kit/vite';
 import { defineConfig } from 'vite';
 
 export default defineConfig({
-  plugins: [sveltekit()],
+  plugins: [sveltekit({ adapter: adapter() })],
 });

packages/web/package.json

@@ -123,11 +123,11 @@
   },
   "peerDependencies": {
     "@remix-run/react": "^2",
-    "@sveltejs/kit": "^1 || ^2",
+    "@sveltejs/kit": "^3",
     "next": ">= 13",
     "nuxt": ">= 3",
     "react": "^18 || ^19 || ^19.0.0-rc",
-    "svelte": ">= 4",
+    "svelte": ">= 5.57.1",
     "vue": "^3",
     "vue-router": "^4"
   },

packages/web/src/sveltekit/index.ts

@@ -1,6 +1,6 @@
 import type {} from '@sveltejs/kit';
-import { browser } from '$app/environment';
-import { page } from '$app/stores';
+import { browser } from '$app/env';
+import { afterNavigate } from '$app/navigation';
 import { inject, pageview, track } from '../generic';
 import type { AnalyticsProps, BeforeSend, BeforeSendEvent } from '../types';
 import { getBasePath, getConfigString } from './utils';
@@ -17,13 +17,13 @@ function injectAnalytics(props: Omit<AnalyticsProps, 'framework'> = {}): void {
       getConfigString(),
     );
 
-    page.subscribe(({ route, url }) => {
-      if (route?.id) {
-        pageview({ route: route.id, path: url.pathname });
+    afterNavigate(({ to }) => {
+      if (to?.route.id) {
+        pageview({ route: to.route.id, path: to.url.pathname });
       }
     });
   }
 }
 
-export { injectAnalytics, track };
 export type { AnalyticsProps, BeforeSend, BeforeSendEvent };
+export { injectAnalytics, track };