diff --git a/.changeset/eleven-hats-search.md b/.changeset/eleven-hats-search.md
new file mode 100644
index 000000000..88d3a9934
--- /dev/null
+++ b/.changeset/eleven-hats-search.md
@@ -0,0 +1,5 @@
+---
+'@sveltejs/vite-plugin-svelte': patch
+---
+
+feat: support Svelte 5 compiler API
diff --git a/packages/e2e-tests/autoprefixer-browerslist/package.json b/packages/e2e-tests/autoprefixer-browerslist/package.json
index 1935658d5..f6099b39c 100644
--- a/packages/e2e-tests/autoprefixer-browerslist/package.json
+++ b/packages/e2e-tests/autoprefixer-browerslist/package.json
@@ -13,7 +13,7 @@
   "devDependencies": {
     "@sveltejs/vite-plugin-svelte": "workspace:^",
     "autoprefixer": "^10.4.15",
-    "postcss": "^8.4.29",
+    "postcss": "^8.4.31",
     "postcss-load-config": "^4.0.1",
     "svelte": "^4.2.0",
     "svelte-preprocess": "^5.0.4",
diff --git a/packages/vite-plugin-svelte/src/index.js b/packages/vite-plugin-svelte/src/index.js
index 04b484d4e..8020a09ca 100644
--- a/packages/vite-plugin-svelte/src/index.js
+++ b/packages/vite-plugin-svelte/src/index.js
@@ -298,7 +298,7 @@ export function svelte(inlineOptions) {
 				try {
 					// @ts-ignore doesn't exist in Svelte 4
 					const compileResult = await svelteCompiler.compileModule(code, {
-						generate: ssr ? 'ssr' : 'dom',
+						generate: isSvelte5 ? (ssr ? 'server' : 'client') : ssr ? 'ssr' : 'dom',
 						filename: moduleRequest.filename
 					});
 					logCompilerWarnings(moduleRequest, compileResult.warnings, options);
diff --git a/packages/vite-plugin-svelte/src/utils/compile.js b/packages/vite-plugin-svelte/src/utils/compile.js
index 11c975035..3ac308784 100644
--- a/packages/vite-plugin-svelte/src/utils/compile.js
+++ b/packages/vite-plugin-svelte/src/utils/compile.js
@@ -9,7 +9,7 @@ import { mapToRelative } from './sourcemaps.js';
 
 const scriptLangRE = /<script [^>]*lang=["']?([^"' >]+)["']?[^>]*>/;
 
-import { isSvelte3 } from './svelte-version.js';
+import { isSvelte3, isSvelte5 } from './svelte-version.js';
 
 /**
  * @param {Function} [makeHot]
@@ -53,7 +53,8 @@ export const _createCompileSvelte = (makeHot) => {
 		const compileOptions = {
 			...options.compilerOptions,
 			filename,
-			generate: ssr ? 'ssr' : 'dom'
+			// @ts-expect-error generate type is different for svelte5
+			generate: isSvelte5 ? (ssr ? 'server' : 'client') : ssr ? 'ssr' : 'dom'
 		};
 		if (isSvelte3) {
 			// @ts-ignore
diff --git a/packages/vite-plugin-svelte/src/utils/esbuild.js b/packages/vite-plugin-svelte/src/utils/esbuild.js
index e6df83163..aac16bd73 100644
--- a/packages/vite-plugin-svelte/src/utils/esbuild.js
+++ b/packages/vite-plugin-svelte/src/utils/esbuild.js
@@ -65,7 +65,7 @@ async function compileSvelte(options, { filename, code }, statsCollection) {
 		// @ts-ignore doesn't exist in Svelte 4
 		const compiled = svelte.compileModule(code, {
 			filename,
-			generate: 'dom',
+			generate: isSvelte5 ? 'client' : 'dom',
 			runes: true
 		});
 		if (endStat) {
@@ -86,7 +86,8 @@ async function compileSvelte(options, { filename, code }, statsCollection) {
 		...options.compilerOptions,
 		css,
 		filename,
-		generate: 'dom'
+		// @ts-expect-error generate type is different for svelte5
+		generate: isSvelte5 ? 'client' : 'dom'
 	};
 	if (isSvelte3) {
 		// @ts-ignore
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index cb55f5e23..4ae3569dd 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -179,19 +179,19 @@ importers:
         version: link:../../vite-plugin-svelte
       autoprefixer:
         specifier: ^10.4.15
-        version: 10.4.15(postcss@8.4.29)
+        version: 10.4.15(postcss@8.4.31)
       postcss:
-        specifier: ^8.4.29
-        version: 8.4.29
+        specifier: ^8.4.31
+        version: 8.4.31
       postcss-load-config:
         specifier: ^4.0.1
-        version: 4.0.1(postcss@8.4.29)
+        version: 4.0.1(postcss@8.4.31)
       svelte:
         specifier: ^4.2.0
         version: 4.2.0
       svelte-preprocess:
         specifier: ^5.0.4
-        version: 5.0.4(postcss-load-config@4.0.1)(postcss@8.4.29)(svelte@4.2.0)(typescript@5.2.2)
+        version: 5.0.4(postcss-load-config@4.0.1)(postcss@8.4.31)(svelte@4.2.0)(typescript@5.2.2)
       vite:
         specifier: ^4.4.9
         version: 4.4.9(@types/node@18.17.15)(sass@1.67.0)(stylus@0.60.0)
@@ -226,7 +226,7 @@ importers:
         version: 4.2.0
       svelte-preprocess:
         specifier: ^5.0.4
-        version: 5.0.4(postcss@8.4.29)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
+        version: 5.0.4(postcss@8.4.31)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
       vite:
         specifier: ^4.4.9
         version: 4.4.9(@types/node@18.17.15)(sass@1.67.0)(stylus@0.60.0)
@@ -383,7 +383,7 @@ importers:
         version: 4.2.0
       svelte-check:
         specifier: ^3.5.1
-        version: 3.5.1(postcss@8.4.29)(svelte@4.2.0)
+        version: 3.5.1(postcss@8.4.31)(svelte@4.2.0)
       svelte-i18n:
         specifier: ^3.7.4
         version: 3.7.4(svelte@4.2.0)
@@ -448,7 +448,7 @@ importers:
         version: 4.2.0
       svelte-preprocess:
         specifier: ^5.0.4
-        version: 5.0.4(postcss@8.4.29)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
+        version: 5.0.4(postcss@8.4.31)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
       vite:
         specifier: ^4.4.9
         version: 4.4.9(@types/node@18.17.15)(sass@1.67.0)(stylus@0.60.0)
@@ -500,7 +500,7 @@ importers:
         version: 4.2.0
       svelte-preprocess:
         specifier: ^5.0.4
-        version: 5.0.4(postcss@8.4.29)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
+        version: 5.0.4(postcss@8.4.31)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
       typescript:
         specifier: ^5.2.2
         version: 5.2.2
@@ -524,7 +524,7 @@ importers:
         version: 4.2.0
       svelte-preprocess:
         specifier: ^5.0.4
-        version: 5.0.4(postcss@8.4.29)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
+        version: 5.0.4(postcss@8.4.31)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
       vite:
         specifier: ^4.4.9
         version: 4.4.9(@types/node@18.17.15)(sass@1.67.0)(stylus@0.60.0)
@@ -620,13 +620,13 @@ importers:
         version: 12.3.0
       carbon-preprocess-svelte:
         specifier: ^0.10.0
-        version: 0.10.0(postcss@8.4.29)(svelte@4.2.0)
+        version: 0.10.0(postcss@8.4.31)(svelte@4.2.0)
       svelte:
         specifier: ^4.2.0
         version: 4.2.0
       svelte-preprocess:
         specifier: ^5.0.4
-        version: 5.0.4(postcss@8.4.29)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
+        version: 5.0.4(postcss@8.4.31)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
       vite:
         specifier: ^4.4.9
         version: 4.4.9(@types/node@18.17.15)(sass@1.67.0)(stylus@0.60.0)
@@ -647,7 +647,7 @@ importers:
         version: 12.3.0
       carbon-preprocess-svelte:
         specifier: ^0.10.0
-        version: 0.10.0(postcss@8.4.29)(svelte@4.2.0)
+        version: 0.10.0(postcss@8.4.31)(svelte@4.2.0)
       lodash-es:
         specifier: ^4.17.21
         version: 4.17.21
@@ -656,10 +656,10 @@ importers:
         version: 4.2.0
       svelte-check:
         specifier: ^3.5.1
-        version: 3.5.1(postcss@8.4.29)(svelte@4.2.0)
+        version: 3.5.1(postcss@8.4.31)(svelte@4.2.0)
       svelte-preprocess:
         specifier: ^5.0.4
-        version: 5.0.4(postcss@8.4.29)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
+        version: 5.0.4(postcss@8.4.31)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
       typescript:
         specifier: ^5.2.2
         version: 5.2.2
@@ -690,7 +690,7 @@ importers:
         version: 12.3.0
       carbon-preprocess-svelte:
         specifier: ^0.10.0
-        version: 0.10.0(postcss@8.4.29)(svelte@4.2.0)
+        version: 0.10.0(postcss@8.4.31)(svelte@4.2.0)
       cross-env:
         specifier: ^7.0.3
         version: 7.0.3
@@ -702,7 +702,7 @@ importers:
         version: 4.2.0
       svelte-preprocess:
         specifier: ^5.0.4
-        version: 5.0.4(postcss@8.4.29)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
+        version: 5.0.4(postcss@8.4.31)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
       vite:
         specifier: ^4.4.9
         version: 4.4.9(@types/node@18.17.15)(sass@1.67.0)(stylus@0.60.0)
@@ -729,7 +729,7 @@ importers:
         version: 4.2.0
       svelte-check:
         specifier: ^3.5.1
-        version: 3.5.1(postcss@8.4.29)(svelte@4.2.0)
+        version: 3.5.1(postcss@8.4.31)(svelte@4.2.0)
       typescript:
         specifier: ^5.2.2
         version: 5.2.2
@@ -2159,7 +2159,7 @@ packages:
     resolution: {integrity: sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==}
     dev: true
 
-  /autoprefixer@10.4.15(postcss@8.4.29):
+  /autoprefixer@10.4.15(postcss@8.4.31):
     resolution: {integrity: sha512-KCuPB8ZCIqFdA4HwKXsvz7j6gvSDNhDP7WnUjBleRkKjPdvCmHFuQ77ocavI8FT6NdvlBnE2UFr2H4Mycn8Vew==}
     engines: {node: ^10 || ^12 || >=14}
     hasBin: true
@@ -2171,7 +2171,7 @@ packages:
       fraction.js: 4.3.6
       normalize-range: 0.1.2
       picocolors: 1.0.0
-      postcss: 8.4.29
+      postcss: 8.4.31
       postcss-value-parser: 4.2.0
     dev: true
 
@@ -2346,11 +2346,11 @@ packages:
     resolution: {integrity: sha512-RZI1nJEjnpgBka4A6zwEkNNqYfV9H7WjcyQ4JYPLoMO8a7N7mAVbaG9ngHUEahxf/byaHBp+EJD3Natf1dkylQ==}
     dev: true
 
-  /carbon-preprocess-svelte@0.10.0(postcss@8.4.29)(svelte@4.2.0):
+  /carbon-preprocess-svelte@0.10.0(postcss@8.4.31)(svelte@4.2.0):
     resolution: {integrity: sha512-jsmVvLcCKuxyoEkyRXvBux4JdatglTuqlDt95TiXiXmOS4XCcrHYSNiBzJ9vsOHpQIaRy8lGQxx6mh6G1lr6FQ==}
     dependencies:
       purgecss: 4.1.3
-      svelte-preprocess: 5.0.4(postcss@8.4.29)(svelte@4.2.0)(typescript@4.9.5)
+      svelte-preprocess: 5.0.4(postcss@8.4.31)(svelte@4.2.0)(typescript@4.9.5)
       typescript: 4.9.5
     transitivePeerDependencies:
       - '@babel/core'
@@ -3169,9 +3169,9 @@ packages:
       eslint: 8.49.0
       esutils: 2.0.3
       known-css-properties: 0.28.0
-      postcss: 8.4.29
-      postcss-load-config: 3.1.4(postcss@8.4.29)
-      postcss-safe-parser: 6.0.0(postcss@8.4.29)
+      postcss: 8.4.31
+      postcss-load-config: 3.1.4(postcss@8.4.31)
+      postcss-safe-parser: 6.0.0(postcss@8.4.31)
       postcss-selector-parser: 6.0.13
       semver: 7.5.4
       svelte: 4.2.0
@@ -5010,7 +5010,7 @@ packages:
     engines: {node: '>=4'}
     dev: true
 
-  /postcss-load-config@3.1.4(postcss@8.4.29):
+  /postcss-load-config@3.1.4(postcss@8.4.31):
     resolution: {integrity: sha512-6DiM4E7v4coTE4uzA8U//WhtPwyhiim3eyjEMFCnUpzbrkK9wJHgKDT2mR+HbtSrd/NubVaYTOpSpjUl8NQeRg==}
     engines: {node: '>= 10'}
     peerDependencies:
@@ -5023,11 +5023,11 @@ packages:
         optional: true
     dependencies:
       lilconfig: 2.1.0
-      postcss: 8.4.29
+      postcss: 8.4.31
       yaml: 1.10.2
     dev: true
 
-  /postcss-load-config@4.0.1(postcss@8.4.29):
+  /postcss-load-config@4.0.1(postcss@8.4.31):
     resolution: {integrity: sha512-vEJIc8RdiBRu3oRAI0ymerOn+7rPuMvRXslTvZUKZonDHFIczxztIyJ1urxM1x9JXEikvpWWTUUqal5j/8QgvA==}
     engines: {node: '>= 14'}
     peerDependencies:
@@ -5040,26 +5040,26 @@ packages:
         optional: true
     dependencies:
       lilconfig: 2.1.0
-      postcss: 8.4.29
+      postcss: 8.4.31
       yaml: 2.3.2
     dev: true
 
-  /postcss-safe-parser@6.0.0(postcss@8.4.29):
+  /postcss-safe-parser@6.0.0(postcss@8.4.31):
     resolution: {integrity: sha512-FARHN8pwH+WiS2OPCxJI8FuRJpTVnn6ZNFiqAM2aeW2LwTHWWmWgIyKC6cUo0L8aeKiF/14MNvnpls6R2PBeMQ==}
     engines: {node: '>=12.0'}
     peerDependencies:
       postcss: ^8.3.3
     dependencies:
-      postcss: 8.4.29
+      postcss: 8.4.31
     dev: true
 
-  /postcss-scss@4.0.8(postcss@8.4.29):
+  /postcss-scss@4.0.8(postcss@8.4.31):
     resolution: {integrity: sha512-Cr0X8Eu7xMhE96PJck6ses/uVVXDtE5ghUTKNUYgm8ozgP2TkgV3LWs3WgLV1xaSSLq8ZFiXaUrj0LVgG1fGEA==}
     engines: {node: '>=12.0'}
     peerDependencies:
       postcss: ^8.4.29
     dependencies:
-      postcss: 8.4.29
+      postcss: 8.4.31
     dev: true
 
   /postcss-selector-parser@6.0.13:
@@ -5074,8 +5074,8 @@ packages:
     resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
     dev: true
 
-  /postcss@8.4.29:
-    resolution: {integrity: sha512-cbI+jaqIeu/VGqXEarWkRCCffhjgXc0qjBtXpqJhTBohMUjUQnbBr0xqX3vEKudc4iviTewcJo5ajcec5+wdJw==}
+  /postcss@8.4.31:
+    resolution: {integrity: sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==}
     engines: {node: ^10 || ^12 || >=14}
     dependencies:
       nanoid: 3.3.6
@@ -5167,7 +5167,7 @@ packages:
     dependencies:
       commander: 8.3.0
       glob: 7.2.3
-      postcss: 8.4.29
+      postcss: 8.4.31
       postcss-selector-parser: 6.0.13
     dev: true
 
@@ -5768,7 +5768,7 @@ packages:
     engines: {node: '>= 0.4'}
     dev: true
 
-  /svelte-check@3.5.1(postcss@8.4.29)(svelte@4.2.0):
+  /svelte-check@3.5.1(postcss@8.4.31)(svelte@4.2.0):
     resolution: {integrity: sha512-+Zb4iHxAhdUtcUg/WJPRjlS1RJalIsWAe9Mz6G1zyznSs7dDkT7VUBdXc3q7Iwg49O/VrZgyJRvOJkjuBfKjFA==}
     hasBin: true
     peerDependencies:
@@ -5781,7 +5781,7 @@ packages:
       picocolors: 1.0.0
       sade: 1.8.1
       svelte: 4.2.0
-      svelte-preprocess: 5.0.4(postcss@8.4.29)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
+      svelte-preprocess: 5.0.4(postcss@8.4.31)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2)
       typescript: 5.2.2
     transitivePeerDependencies:
       - '@babel/core'
@@ -5807,8 +5807,8 @@ packages:
       eslint-scope: 7.2.2
       eslint-visitor-keys: 3.4.3
       espree: 9.6.1
-      postcss: 8.4.29
-      postcss-scss: 4.0.8(postcss@8.4.29)
+      postcss: 8.4.31
+      postcss-scss: 4.0.8(postcss@8.4.31)
       svelte: 4.2.0
     dev: true
 
@@ -5838,7 +5838,7 @@ packages:
       tiny-glob: 0.2.9
     dev: true
 
-  /svelte-preprocess@5.0.4(postcss-load-config@4.0.1)(postcss@8.4.29)(svelte@4.2.0)(typescript@5.2.2):
+  /svelte-preprocess@5.0.4(postcss-load-config@4.0.1)(postcss@8.4.31)(svelte@4.2.0)(typescript@5.2.2):
     resolution: {integrity: sha512-ABia2QegosxOGsVlsSBJvoWeXy1wUKSfF7SWJdTjLAbx/Y3SrVevvvbFNQqrSJw89+lNSsM58SipmZJ5SRi5iw==}
     engines: {node: '>= 14.10.0'}
     requiresBuild: true
@@ -5879,15 +5879,15 @@ packages:
       '@types/pug': 2.0.6
       detect-indent: 6.1.0
       magic-string: 0.27.0
-      postcss: 8.4.29
-      postcss-load-config: 4.0.1(postcss@8.4.29)
+      postcss: 8.4.31
+      postcss-load-config: 4.0.1(postcss@8.4.31)
       sorcery: 0.11.0
       strip-indent: 3.0.0
       svelte: 4.2.0
       typescript: 5.2.2
     dev: true
 
-  /svelte-preprocess@5.0.4(postcss@8.4.29)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2):
+  /svelte-preprocess@5.0.4(postcss@8.4.31)(sass@1.67.0)(svelte@4.2.0)(typescript@5.2.2):
     resolution: {integrity: sha512-ABia2QegosxOGsVlsSBJvoWeXy1wUKSfF7SWJdTjLAbx/Y3SrVevvvbFNQqrSJw89+lNSsM58SipmZJ5SRi5iw==}
     engines: {node: '>= 14.10.0'}
     requiresBuild: true
@@ -5928,7 +5928,7 @@ packages:
       '@types/pug': 2.0.6
       detect-indent: 6.1.0
       magic-string: 0.27.0
-      postcss: 8.4.29
+      postcss: 8.4.31
       sass: 1.67.0
       sorcery: 0.11.0
       strip-indent: 3.0.0
@@ -5936,7 +5936,7 @@ packages:
       typescript: 5.2.2
     dev: true
 
-  /svelte-preprocess@5.0.4(postcss@8.4.29)(svelte@4.2.0)(typescript@4.9.5):
+  /svelte-preprocess@5.0.4(postcss@8.4.31)(svelte@4.2.0)(typescript@4.9.5):
     resolution: {integrity: sha512-ABia2QegosxOGsVlsSBJvoWeXy1wUKSfF7SWJdTjLAbx/Y3SrVevvvbFNQqrSJw89+lNSsM58SipmZJ5SRi5iw==}
     engines: {node: '>= 14.10.0'}
     requiresBuild: true
@@ -5977,7 +5977,7 @@ packages:
       '@types/pug': 2.0.6
       detect-indent: 6.1.0
       magic-string: 0.27.0
-      postcss: 8.4.29
+      postcss: 8.4.31
       sorcery: 0.11.0
       strip-indent: 3.0.0
       svelte: 4.2.0
@@ -6365,7 +6365,7 @@ packages:
     dependencies:
       '@types/node': 18.17.15
       esbuild: 0.18.20
-      postcss: 8.4.29
+      postcss: 8.4.31
       rollup: 3.29.1
       sass: 1.67.0
       stylus: 0.60.0