Merge branch 'main' into refactor/modular-plugins

dominikg · dominikg · commit dc0019c64c3f · 2025-06-23T11:19:27.000+02:00
diff --git a/.changeset/nasty-ghosts-warn.md b/.changeset/nasty-ghosts-warn.md
@@ -0,0 +1,5 @@
+---
+'@sveltejs/vite-plugin-svelte': major
+---
+
+remove support for loading commonjs svelte config files
diff --git a/.changeset/real-cups-scream.md b/.changeset/real-cups-scream.md
@@ -0,0 +1,5 @@
+---
+'@sveltejs/vite-plugin-svelte': patch
+---
+
+log known-issues link when using rolldown-vite
diff --git a/.changeset/tall-rivers-sleep.md b/.changeset/tall-rivers-sleep.md
@@ -0,0 +1,5 @@
+---
+'@sveltejs/vite-plugin-svelte': minor
+---
+
+add support for loading typescript svelte config files in runtimes that support it
diff --git a/packages/e2e-tests/configfile-custom/__tests__/configfile-custom.spec.ts b/packages/e2e-tests/configfile-custom/__tests__/configfile-custom.spec.ts
@@ -1,5 +1,8 @@
 import { it, expect } from 'vitest';
 import { editViteConfig, isBuild, page, e2eServer } from '~utils';
+import { versions } from 'node:process';
+
+const isNodeWithoutTypeStripping = Number(versions.node?.split('.', 1)[0]) < 22;
 
 it('should load default config and work', async () => {
 	expect(e2eServer.logs.server.out).toContain('default svelte config loaded');
@@ -11,11 +14,11 @@ it('should load default config and work', async () => {
 if (!isBuild) {
 	// editing vite config does not work in build tests, build only runs once
 	// TODO split into different tests
-	it('should load custom cjs config and work', async () => {
+	it.skipIf(isNodeWithoutTypeStripping)('should load custom ts config and work', async () => {
 		await editViteConfig((c) =>
-			c.replace(/svelte\([^)]*\)/, "svelte({configFile:'svelte.config.custom.cjs'})")
+			c.replace(/svelte\([^)]*\)/, "svelte({configFile:'svelte.config.custom.ts'})")
 		);
-		expect(e2eServer.logs.server.out).toContain('custom svelte config loaded cjs');
+		expect(e2eServer.logs.server.out).toContain('custom svelte config loaded ts');
 		expect(await page.textContent('h1')).toMatch('Hello world!');
 		expect(await page.textContent('#test-child')).toBe('test-child');
 		expect(await page.textContent('#dependency-import')).toBe('dependency-import');
diff --git a/packages/e2e-tests/configfile-custom/package.json b/packages/e2e-tests/configfile-custom/package.json
@@ -3,8 +3,8 @@
   "private": true,
   "version": "1.0.0",
   "scripts": {
-    "dev": "vite",
-    "build": "vite build",
+    "dev": "cross-env NODE_OPTIONS=\"--experimental-strip-types\" vite",
+    "build": "cross-env NODE_OPTIONS=\"--experimental-strip-types\" vite build",
     "preview": "vite preview"
   },
   "dependencies": {
diff --git a/packages/e2e-tests/configfile-custom/svelte.config.custom.cjs b/packages/e2e-tests/configfile-custom/svelte.config.custom.cjs
diff --git a/packages/e2e-tests/configfile-custom/svelte.config.custom.ts b/packages/e2e-tests/configfile-custom/svelte.config.custom.ts
@@ -0,0 +1,8 @@
+console.log('custom svelte config loaded ts');
+import type { SvelteConfig } from '@sveltejs/vite-plugin-svelte';
+const config: SvelteConfig = {
+	vitePlugin: {
+		emitCss: false
+	}
+};
+export default config;
diff --git a/packages/e2e-tests/configfile-custom/svelte.config.js b/packages/e2e-tests/configfile-custom/svelte.config.js
@@ -1,2 +1,2 @@
 console.log('default svelte config loaded');
-module.exports = {};
+export default {};
diff --git a/packages/e2e-tests/hmr/__tests__/hmr.spec.ts b/packages/e2e-tests/hmr/__tests__/hmr.spec.ts
@@ -164,10 +164,10 @@ if (!isBuild) {
 		});
 
 		test('should work with emitCss: false in svelte config', async () => {
-			addFile('svelte.config.cjs', 'module.exports={vitePlugin:{emitCss:false}}');
+			addFile('svelte.config.js', 'export default {vitePlugin:{emitCss:false}}');
 			await waitForServerRestartAndPageReload();
 			expect(await getColor('#hmr-test-1 .label')).toBe('red');
-			removeFile('svelte.config.cjs');
+			removeFile('svelte.config.js');
 		});
 
 		test('should detect changes in svelte config and restart', async () => {
@@ -182,8 +182,8 @@ if (!isBuild) {
 				}
 			};
 			await addFile(
-				'svelte.config.cjs',
-				`module.exports = {
+				'svelte.config.js',
+				`export default {
 			  preprocess:[{markup:${injectPreprocessor.toString()}}]};`
 			);
 			await waitForServerRestartAndPageReload();
@@ -196,7 +196,7 @@ if (!isBuild) {
 			await updateHmrTest((content) => content.replace('color: red', 'color: green'));
 			expect(await getColor('#hmr-test-1 .label')).toBe('green');
 			expect(await getText('#hmr-test-1 .counter')).toBe('1');
-			await editFile('svelte.config.cjs', (content) =>
+			await editFile('svelte.config.js', (content) =>
 				content
 					.replace('preprocess-inject', 'preprocess-inject-2')
 					.replace('Injected', 'Injected 2')
@@ -212,7 +212,7 @@ if (!isBuild) {
 			await updateHmrTest((content) => content.replace('color: green', 'color: red'));
 			expect(await getColor('#hmr-test-1 .label')).toBe('red');
 			expect(await getText('#hmr-test-1 .counter')).toBe('1');
-			await removeFile('svelte.config.cjs');
+			await removeFile('svelte.config.js');
 			await waitForServerRestartAndPageReload();
 			expect(await getEl('#preprocess-inject-2')).toBe(null);
 			expect(await getEl('#preprocess-inject')).toBe(null);
diff --git a/packages/e2e-tests/kit-node/__tests__/kit.spec.ts b/packages/e2e-tests/kit-node/__tests__/kit.spec.ts
@@ -16,7 +16,14 @@ import {
 
 import glob from 'tiny-glob';
 import path from 'node:path';
-import { defaultClientConditions, defaultClientMainFields } from 'vite';
+import { env } from 'node:process';
+import * as vite from 'vite';
+const {
+	defaultClientConditions,
+	defaultClientMainFields,
+	//@ts-expect-error not typed in vite
+	rolldownVersion
+} = vite;
 import { describe, expect, it } from 'vitest';
 
 describe('kit-node', () => {
@@ -93,18 +100,23 @@ describe('kit-node', () => {
 		});
 
 		if (isBuild) {
-			it('should not include dynamic import from onmount in ssr output', async () => {
-				const ssrManifest = JSON.parse(
-					readFileContent('.svelte-kit/output/server/.vite/manifest.json')
-				);
-				const serverFilesSrc = Object.values(ssrManifest)
-					.filter((e) => !!e.src)
-					.map((e) => e.src);
-				const includesClientOnlyModule = serverFilesSrc.some((file: string) =>
-					file.includes('client-only-module')
-				);
-				expect(includesClientOnlyModule).toBe(false);
-			});
+			// this is known to fail, skip the test in our own CI but keep it in ecosystem-ci so that rolldown-vite-ecosystem-ci still gets this fail
+			// TODO remove skip once fixed
+			it.skipIf(rolldownVersion && !env.ECOSYSTEM_CI)(
+				'should not include dynamic import from onMount in ssr output',
+				async () => {
+					const ssrManifest = JSON.parse(
+						readFileContent('.svelte-kit/output/server/.vite/manifest.json')
+					);
+					const serverFilesSrc = Object.values(ssrManifest)
+						.filter((e) => !!e.src)
+						.map((e) => e.src);
+					const includesClientOnlyModule = serverFilesSrc.some((file: string) =>
+						file.includes('client-only-module')
+					);
+					expect(includesClientOnlyModule).toBe(false);
+				}
+			);
 			it('should include dynamic import from onmount in client output', async () => {
 				const clientManifest = JSON.parse(
 					readFileContent('.svelte-kit/output/client/.vite/manifest.json')
diff --git a/packages/e2e-tests/scan-deps/__tests__/scan-deps.spec.ts b/packages/e2e-tests/scan-deps/__tests__/scan-deps.spec.ts
@@ -4,7 +4,11 @@ describe('vite import scan', () => {
 	it('should not fail to discover dependencies exported from script module', async () => {
 		// vite logs an error if scan fails but continues, so validate no errors logged
 		const errorLogs = e2eServer.logs.server.err.filter(
-			(line) => !line.includes('Support for rolldown-vite in vite-plugin-svelte is experimental')
+			(line) =>
+				![
+					'Support for rolldown-vite in vite-plugin-svelte is experimental',
+					'See https://github.com/sveltejs/vite-plugin-svelte/issues/1143 for a list of known issues'
+				].some((ignore) => line.includes(ignore))
 		);
 		expect(errorLogs.length, `unexpected errors:\n${errorLogs.join('\n')}`).toBe(0);
 	});
diff --git a/packages/e2e-tests/vitestSetup.ts b/packages/e2e-tests/vitestSetup.ts
@@ -145,6 +145,17 @@ beforeAll(
 				if (fs.existsSync(logsDir)) {
 					fs.rmSync(logsDir, { recursive: true, force: true });
 				}
+				// remove strip types flag for node < 22, it doesn't work there
+				// TODO: remove once node20 is no longer part of CI
+				if (Number(process.versions.node?.split('.', 1)[0]) < 22) {
+					const pkgFile = path.join(tempDir, 'package.json');
+					const pkgContent = fs.readFileSync(pkgFile, 'utf-8');
+					const newContent = pkgContent.replaceAll(
+						'cross-env NODE_OPTIONS=\\"--experimental-strip-types\\" ',
+						''
+					);
+					fs.writeFileSync(pkgFile, newContent, 'utf-8');
+				}
 				await fs.mkdir(logsDir);
 				const customServerScript = path.resolve(path.dirname(testPath), 'serve.js');
 				const defaultServerScript = path.resolve(e2eTestsRoot, 'e2e-server.js');
diff --git a/packages/vite-plugin-svelte/src/plugins/configure.js b/packages/vite-plugin-svelte/src/plugins/configure.js
@@ -25,7 +25,11 @@ const { version: viteVersion, rolldownVersion, perEnvironmentState } = vite;
 export function configure(api, inlineOptions) {
 	if (rolldownVersion) {
 		log.warn.once(
-			`!!! Support for rolldown-vite in vite-plugin-svelte is experimental (rolldown: ${rolldownVersion}, vite: ${viteVersion}) !!!`
+			`!!! Support for rolldown-vite in vite-plugin-svelte is experimental (rolldown: ${rolldownVersion}, vite: ${viteVersion}) !!!
+			See https://github.com/sveltejs/vite-plugin-svelte/issues/1143 for a list of known issues and to report feedback.`.replace(
+				/\t+/g,
+				'\t'
+			)
 		);
 	}
 
diff --git a/packages/vite-plugin-svelte/src/utils/load-svelte-config.js b/packages/vite-plugin-svelte/src/utils/load-svelte-config.js
@@ -1,21 +1,12 @@
-import { createRequire } from 'node:module';
 import path from 'node:path';
 import process from 'node:process';
 import fs from 'node:fs';
 import { pathToFileURL } from 'node:url';
 import { log } from './log.js';
 
-// used to require cjs config in esm.
-// NOTE dynamic import() cjs technically works, but timestamp query cache bust
-// have no effect, likely because it has another internal cache?
-/** @type {NodeRequire}*/
-let esmRequire;
-
-export const knownSvelteConfigNames = [
-	'svelte.config.js',
-	'svelte.config.cjs',
-	'svelte.config.mjs'
-];
+export const knownSvelteConfigNames = ['js', 'ts', 'mjs', 'mts'].map(
+	(ext) => `svelte.config.${ext}`
+);
 
 /**
  * @param {string} filePath
@@ -36,56 +27,23 @@ export async function loadSvelteConfig(viteConfig, inlineOptions) {
 	}
 	const configFile = findConfigToLoad(viteConfig, inlineOptions);
 	if (configFile) {
-		let err;
-		// try to use dynamic import for svelte.config.js first
-		if (configFile.endsWith('.js') || configFile.endsWith('.mjs')) {
-			try {
-				const result = await dynamicImportDefault(
-					pathToFileURL(configFile).href,
-					fs.statSync(configFile).mtimeMs
-				);
-				if (result != null) {
-					return {
-						...result,
-						configFile
-					};
-				} else {
-					throw new Error(`invalid export in ${configFile}`);
-				}
-			} catch (e) {
-				log.error(`failed to import config ${configFile}`, e);
-				err = e;
-			}
-		}
-		// cjs or error with dynamic import
-		if (!configFile.endsWith('.mjs')) {
-			try {
-				// identify which require function to use (esm and cjs mode)
-				const _require = import.meta.url
-					? (esmRequire ?? (esmRequire = createRequire(import.meta.url)))
-					: // eslint-disable-next-line no-undef
-						require;
-
-				// avoid loading cached version on reload
-				delete _require.cache[_require.resolve(configFile)];
-				const result = _require(configFile);
-				if (result != null) {
-					return {
-						...result,
-						configFile
-					};
-				} else {
-					throw new Error(`invalid export in ${configFile}`);
-				}
-			} catch (e) {
-				log.error(`failed to require config ${configFile}`, e);
-				if (!err) {
-					err = e;
-				}
+		try {
+			const result = await dynamicImportDefault(
+				pathToFileURL(configFile).href,
+				fs.statSync(configFile).mtimeMs
+			);
+			if (result != null) {
+				return {
+					...result,
+					configFile
+				};
+			} else {
+				throw new Error(`invalid export in ${configFile}`);
 			}
+		} catch (e) {
+			log.error(`failed to import config ${configFile}`, e);
+			throw e;
 		}
-		// failed to load existing config file
-		throw err;
 	}
 }
 
diff --git a/packages/vite-plugin-svelte/types/index.d.ts.map b/packages/vite-plugin-svelte/types/index.d.ts.map
@@ -26,6 +26,6 @@
 		null,
 		null
 	],
-	"mappings": ";;;;aAIYA,OAAOA;;WAETC,mBAAmBA;;;;;;;;;;;kBAWZC,aAAaA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAgGbC,YAAYA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;WAiDnBC,mBAAmBA;;;;;;;;;;;;;;;;WAgBnBC,oBAAoBA;;;;;;;;;;;;;;;MAezBC,SAASA;;kBAEGC,qBAAqBA;;;;;;;;;;;;;;;;;;iBChLtBC,MAAMA;iBCMNC,cAAcA;iBCORC,gBAAgBA",
+	"mappings": ";;;;aAIYA,OAAOA;;WAETC,mBAAmBA;;;;;;;;;;;kBAWZC,aAAaA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAgGbC,YAAYA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;WAiDnBC,mBAAmBA;;;;;;;;;;;;;;;;WAgBnBC,oBAAoBA;;;;;;;;;;;;;;;MAezBC,SAASA;;kBAEGC,qBAAqBA;;;;;;;;;;;;;;;;;;iBChLtBC,MAAMA;iBCMNC,cAAcA;iBCFRC,gBAAgBA",
 	"ignoreList": []
 }

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +'@sveltejs/vite-plugin-svelte': major
 +---
++
 +remove support for loading commonjs svelte config files
Original file line number	Diff line number	Diff line change
`@@ -1,2 +1,2 @@`
`1`	`1`	`console.log('default svelte config loaded');`
`2`		`-module.exports = {};`
	`2`	`+export default {};`