From 993dba7966cf2a7e6bd6a2deaf600aa38a6b0f3b Mon Sep 17 00:00:00 2001
From: Lucas Piera <pieralukasz@gmail.com>
Date: Fri, 9 Oct 2026 12:28:37 +0200
Subject: [PATCH] docs(svelte): import browser from $app/env instead of
 $app/environment

---
 docs/framework/svelte/ssr.md                                  | 4 ++--
 examples/svelte/auto-refetching/src/routes/+layout.svelte     | 2 +-
 examples/svelte/basic/src/routes/+layout.svelte               | 2 +-
 .../load-more-infinite-scroll/src/routes/+layout.svelte       | 2 +-
 examples/svelte/optimistic-updates/src/routes/+layout.svelte  | 2 +-
 examples/svelte/playground/src/routes/+layout.svelte          | 2 +-
 examples/svelte/ssr/src/routes/+layout.ts                     | 2 +-
 examples/svelte/star-wars/src/routes/+layout.svelte           | 2 +-
 8 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/docs/framework/svelte/ssr.md b/docs/framework/svelte/ssr.md
index 028e2425eab..b699bf66678 100644
--- a/docs/framework/svelte/ssr.md
+++ b/docs/framework/svelte/ssr.md
@@ -13,7 +13,7 @@ The recommended way to achieve this is to use the `browser` module from SvelteKi
 
 ```svelte
 <script lang="ts">
-  import { browser } from '$app/environment'
+  import { browser } from '$app/env'
   import { QueryClient, QueryClientProvider } from '@tanstack/svelte-query'
 
   const queryClient = new QueryClient({
@@ -84,7 +84,7 @@ Svelte Query supports prefetching queries on the server. Using this setup below,
 **src/routes/+layout.ts**
 
 ```ts
-import { browser } from '$app/environment'
+import { browser } from '$app/env'
 import { QueryClient } from '@tanstack/svelte-query'
 
 export async function load() {
diff --git a/examples/svelte/auto-refetching/src/routes/+layout.svelte b/examples/svelte/auto-refetching/src/routes/+layout.svelte
index 4b170dc01ec..0a68d4609f2 100644
--- a/examples/svelte/auto-refetching/src/routes/+layout.svelte
+++ b/examples/svelte/auto-refetching/src/routes/+layout.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
   import '../app.css'
-  import { browser } from '$app/environment'
+  import { browser } from '$app/env'
   import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query'
   import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools'
 
diff --git a/examples/svelte/basic/src/routes/+layout.svelte b/examples/svelte/basic/src/routes/+layout.svelte
index 9ccf7bc9e65..98c0da1b411 100644
--- a/examples/svelte/basic/src/routes/+layout.svelte
+++ b/examples/svelte/basic/src/routes/+layout.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
   import '../app.css'
-  import { browser } from '$app/environment'
+  import { browser } from '$app/env'
   import { QueryClient } from '@tanstack/svelte-query'
   import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools'
   import { PersistQueryClientProvider } from '@tanstack/svelte-query-persist-client'
diff --git a/examples/svelte/load-more-infinite-scroll/src/routes/+layout.svelte b/examples/svelte/load-more-infinite-scroll/src/routes/+layout.svelte
index 4b170dc01ec..0a68d4609f2 100644
--- a/examples/svelte/load-more-infinite-scroll/src/routes/+layout.svelte
+++ b/examples/svelte/load-more-infinite-scroll/src/routes/+layout.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
   import '../app.css'
-  import { browser } from '$app/environment'
+  import { browser } from '$app/env'
   import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query'
   import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools'
 
diff --git a/examples/svelte/optimistic-updates/src/routes/+layout.svelte b/examples/svelte/optimistic-updates/src/routes/+layout.svelte
index 4b170dc01ec..0a68d4609f2 100644
--- a/examples/svelte/optimistic-updates/src/routes/+layout.svelte
+++ b/examples/svelte/optimistic-updates/src/routes/+layout.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
   import '../app.css'
-  import { browser } from '$app/environment'
+  import { browser } from '$app/env'
   import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query'
   import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools'
 
diff --git a/examples/svelte/playground/src/routes/+layout.svelte b/examples/svelte/playground/src/routes/+layout.svelte
index 76c2d0d277d..92159c881ac 100644
--- a/examples/svelte/playground/src/routes/+layout.svelte
+++ b/examples/svelte/playground/src/routes/+layout.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
   import '../app.css'
-  import { browser } from '$app/environment'
+  import { browser } from '$app/env'
   import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query'
   import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools'
 
diff --git a/examples/svelte/ssr/src/routes/+layout.ts b/examples/svelte/ssr/src/routes/+layout.ts
index f922afcc92b..0e870d18c96 100644
--- a/examples/svelte/ssr/src/routes/+layout.ts
+++ b/examples/svelte/ssr/src/routes/+layout.ts
@@ -1,6 +1,6 @@
 import { QueryClient } from '@tanstack/svelte-query'
 import type { LayoutLoad } from './$types'
-import { browser } from '$app/environment'
+import { browser } from '$app/env'
 
 export const load: LayoutLoad = () => {
   const queryClient = new QueryClient({
diff --git a/examples/svelte/star-wars/src/routes/+layout.svelte b/examples/svelte/star-wars/src/routes/+layout.svelte
index 925e53ef88b..0abf2f5c3fe 100644
--- a/examples/svelte/star-wars/src/routes/+layout.svelte
+++ b/examples/svelte/star-wars/src/routes/+layout.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
   import '../app.css'
-  import { browser } from '$app/environment'
+  import { browser } from '$app/env'
   import { QueryClientProvider, QueryClient } from '@tanstack/svelte-query'
   import { SvelteQueryDevtools } from '@tanstack/svelte-query-devtools'