Refactor Svelte preprocess integration handling (#5901)

* Let user setup vitePreprocess

* Abstract function

* Add changeset

* Update svelte syntax

* Make fallback

* Fix docs

* Update changeset

* Fix types

1 files changed, 23 insertions, 6 deletions

diff --git a/packages/integrations/svelte/src/index.ts b/packages/integrations/svelte/src/index.ts
index 6bf5bcc4e..7daa9bec5 100644
--- a/packages/integrations/svelte/src/index.ts
+++ b/packages/integrations/svelte/src/index.ts
@@ -2,6 +2,7 @@ import type { Options } from '@sveltejs/vite-plugin-svelte';
 import { svelte, vitePreprocess } from '@sveltejs/vite-plugin-svelte';
 import type { AstroIntegration, AstroRenderer } from 'astro';
 import type { UserConfig } from 'vite';
+import { fileURLToPath } from 'url';
 
 function getRenderer(): AstroRenderer {
 	return {
@@ -11,16 +12,27 @@ function getRenderer(): AstroRenderer {
 	};
 }
 
+async function svelteConfigHasPreprocess(root: URL) {
+	const svelteConfigFiles = ['./svelte.config.js', './svelte.config.cjs', './svelte.config.mjs'];
+	for (const file of svelteConfigFiles) {
+		const filePath = fileURLToPath(new URL(file, root));
+		try {
+			const config = (await import(filePath)).default;
+			return !!config.preprocess;
+		} catch {}
+	}
+}
+
 type ViteConfigurationArgs = {
 	isDev: boolean;
 	options?: Options | OptionsCallback;
+	root: URL;
 };
 
-function getViteConfiguration({ options, isDev }: ViteConfigurationArgs): UserConfig {
+async function getViteConfiguration({ options, isDev, root }: ViteConfigurationArgs): Promise<UserConfig> {
 	const defaultOptions: Partial<Options> = {
 		emitCss: true,
 		compilerOptions: { dev: isDev, hydratable: true },
-		preprocess: [vitePreprocess()],
 	};
 
 	// Disable hot mode during the build
@@ -43,11 +55,13 @@ function getViteConfiguration({ options, isDev }: ViteConfigurationArgs): UserCo
 				// Always use dev and hydratable from defaults
 				...defaultOptions.compilerOptions,
 			},
-			// Ignore default preprocessor if the user provided their own
-			preprocess: options.preprocess ?? defaultOptions.preprocess,
 		};
 	}
 
+	if (!resolvedOptions.preprocess && !(await svelteConfigHasPreprocess(root))) {
+		resolvedOptions.preprocess = vitePreprocess();
+	}
+
 	return {
 		optimizeDeps: {
 			include: ['@astrojs/svelte/client.js'],
@@ -63,15 +77,18 @@ export default function (options?: Options | OptionsCallback): AstroIntegration
 		name: '@astrojs/svelte',
 		hooks: {
 			// Anything that gets returned here is merged into Astro Config
-			'astro:config:setup': ({ command, updateConfig, addRenderer }) => {
+			'astro:config:setup': async ({ command, updateConfig, addRenderer, config }) => {
 				addRenderer(getRenderer());
 				updateConfig({
-					vite: getViteConfiguration({
+					vite: await getViteConfiguration({
 						options,
 						isDev: command === 'dev',
+						root: config.root,
 					}),
 				});
 			},
 		},
 	};
 }
+
+export { vitePreprocess };