fix: optimize "svelte > clsx" by default (#1124)

* fix: optimize svelte > clsx by default

* chore: add comment to explain use of runtime deps

Author: dominikg

.changeset/fine-nights-mix.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/vite-plugin-svelte': patch
+---
+
+add `svelte > clsx` to optimizeDeps.include to avoid page reload when using vite6 and npm

packages/e2e-tests/kit-node/__tests__/kit.spec.ts

@@ -318,6 +318,7 @@ describe('kit-node', () => {
 					'svelte/store',
 					'svelte/transition',
 					'svelte',
+					'svelte > clsx',
 					'svelte/internal/disclose-version',
 					'svelte/internal/flags/legacy',
 					'svelte/internal/flags/tracing',

packages/e2e-tests/prebundle-svelte-deps/__tests__/prebundle-svelte-deps.spec.ts

@@ -33,6 +33,8 @@ if (!isBuild) {
 		expect(optimizedPaths).toContain('e2e-test-dep-svelte-api-only');
 		expect(optimizedPaths).toContain('e2e-test-dep-svelte-nested');
 		expect(optimizedPaths).toContain('e2e-test-dep-svelte-module');
+		expect(optimizedPaths).toContain('svelte');
+		expect(optimizedPaths).toContain('svelte > clsx');
 	});
 
 	test('should not optimize excluded svelte dependencies', () => {

packages/vite-plugin-svelte/src/utils/constants.js

@@ -1,8 +1,13 @@
 import { createRequire } from 'node:module';
 
-export const SVELTE_IMPORTS = Object.entries(
-	createRequire(import.meta.url)('svelte/package.json').exports
-)
+const sveltePkg = createRequire(import.meta.url)('svelte/package.json');
+
+// list of svelte runtime dependencies to optimize together with svelte itself
+export const SVELTE_RUNTIME_DEPENDENCIES = [
+	'clsx' // avoids dev server restart after page load with npm + vite6 (see #1067)
+].filter((dep) => !!sveltePkg.dependencies?.[dep]);
+
+export const SVELTE_IMPORTS = Object.entries(sveltePkg.exports)
 	.map(([name, config]) => {
 		// ignore type only
 		if (typeof config === 'object' && Object.keys(config).length === 1 && config.types) {

packages/vite-plugin-svelte/src/utils/options.js

@@ -12,7 +12,8 @@ import {
 	DEFAULT_SVELTE_EXT,
 	FAQ_LINK_MISSING_EXPORTS_CONDITION,
 	SVELTE_EXPORT_CONDITIONS,
-	SVELTE_IMPORTS
+	SVELTE_IMPORTS,
+	SVELTE_RUNTIME_DEPENDENCIES
 } from './constants.js';
 
 import path from 'node:path';
@@ -550,8 +551,9 @@ function buildExtraConfigForSvelte(config) {
 		const svelteImportsToInclude = SVELTE_IMPORTS.filter(
 			(si) => !(si.endsWith('/server') || si.includes('/server/'))
 		);
+		svelteImportsToInclude.push(...SVELTE_RUNTIME_DEPENDENCIES.map((dep) => `svelte > ${dep}`));
 		log.debug(
-			`adding bare svelte packages to optimizeDeps.include: ${svelteImportsToInclude.join(', ')} `,
+			`adding bare svelte packages and runtime dependencies to optimizeDeps.include: ${svelteImportsToInclude.join(', ')} `,
 			undefined,
 			'config'
 		);