@rsvelte/vite-plugin-svelte 0.1.0

package/src/utils/sourcemaps.js

@@ -0,0 +1,82 @@
+import path from 'node:path';
+import process from 'node:process';
+
+const IS_WINDOWS = process.platform === 'win32';
+
+/**
+ * @typedef {{
+ *  file?: string;
+ *  sources?: string[];
+ *  sourceRoot?: string;
+ * }} SourceMapFileRefs
+ */
+
+/**
+ * convert absolute paths in sourcemap file refs to their relative equivalents to avoid leaking fs info
+ *
+ * map is modified in place.
+ *
+ * @param {SourceMapFileRefs | undefined} map sourcemap
+ * @param {string} filename absolute path to file the sourcemap is for
+ */
+export function mapToRelative(map, filename) {
+	if (!map) {
+		return;
+	}
+	const sourceRoot = map.sourceRoot;
+	const dirname = path.dirname(filename);
+
+	/** @type {(s: string) => string} */
+	const toRelative = (s) => {
+		if (!s) {
+			return s;
+		}
+		/** @type {string} */
+		let sourcePath;
+		if (s.startsWith('file:///')) {
+			// windows has file:///C:/foo and posix has file:///foo, so we have to remove one extra on windows
+			sourcePath = s.slice(IS_WINDOWS ? 8 : 7);
+		} else if (sourceRoot) {
+			const sep = sourceRoot[sourceRoot.length - 1] === '/' || s[0] === '/' ? '' : '/';
+			sourcePath = `${sourceRoot}${sep}${s}`;
+		} else {
+			sourcePath = s;
+		}
+		return path.isAbsolute(sourcePath) ? path.relative(dirname, sourcePath) : sourcePath;
+	};
+
+	if (map.file) {
+		map.file = path.basename(filename);
+	}
+	if (map.sources) {
+		map.sources = map.sources.map(toRelative);
+	}
+	if (map.sourceRoot) {
+		// we have prepended sourceRoot and computed relative paths from it
+		// remove it here to avoid downstream processing prepending it again
+		delete map.sourceRoot;
+	}
+}
+
+/**
+ * vitePreprocess uses an extra lang extension to tell vite about the type of preprocessor to use
+ * This function removes it afterwards to get back working file refs
+ *
+ * map is modified in place.
+ *
+ * @param {SourceMapFileRefs | undefined} map the output sourcemap
+ * @param {string} suffix the suffix to remove
+ */
+export function removeLangSuffix(map, suffix) {
+	if (!map) {
+		return;
+	}
+	/** @type {(s:string)=> string} */
+	const removeSuffix = (s) => (s?.endsWith(suffix) ? s.slice(0, -1 * suffix.length) : s);
+	if (map.file) {
+		map.file = removeSuffix(map.file);
+	}
+	if (map.sources) {
+		map.sources = map.sources.map(removeSuffix);
+	}
+}

package/src/utils/svelte-version.js

@@ -0,0 +1,46 @@
+import { VERSION } from '@rsvelte/compiler';
+
+/**
+ * @type {boolean}
+ */
+export const isSvelteWithAsync = gte(VERSION, '5.36.0');
+
+/**
+ * split semver string and convert to number, ignores non digits in tag
+ * @param {string} semver
+ * @return {number[]} [major,minor,patch,tag]
+ */
+function splitToNumbers(semver) {
+	const num = semver
+		.replace(/[^\d.-]/g, '')
+		.split(/[.-]+/, 4)
+		.map(Number);
+	while (num.length < 3) {
+		num.push(0);
+	}
+	if (num.length < 4) {
+		num.push(Infinity);
+	}
+	return num;
+}
+
+/**
+ * compare semver versions, tags are compared by their numeric part only
+ *
+ * @param {string} a semver version
+ * @param {string} b semver version
+ * @return {boolean} true if a is greater or equal to b
+ */
+export function gte(a, b) {
+	const aNum = splitToNumbers(a);
+	const bNum = splitToNumbers(b);
+	for (let i = 0; i < aNum.length; i++) {
+		if (aNum[i] < bNum[i]) {
+			return false;
+		}
+		if (aNum[i] > bNum[i]) {
+			return true;
+		}
+	}
+	return true;
+}

package/src/utils/vite-plugin-svelte-stats.js

@@ -0,0 +1,248 @@
+import { log } from './log.js';
+import { performance } from 'node:perf_hooks';
+import { normalizePath } from 'vite';
+import { findClosestPkgJsonPath } from 'vitefu';
+import { readFileSync } from 'node:fs';
+import { dirname } from 'node:path';
+
+/** @type {import('../types/vite-plugin-svelte-stats.d.ts').CollectionOptions} */
+const defaultCollectionOptions = {
+	// log after 500ms and more than one file processed
+	logInProgress: (c, now) => now - c.collectionStart > 500 && c.stats.length > 1,
+	// always log results
+	logResult: () => true
+};
+
+/**
+ * @param {number} n
+ * @returns
+ */
+function humanDuration(n) {
+	// 99.9ms  0.10s
+	return n < 100 ? `${n.toFixed(1)}ms` : `${(n / 1000).toFixed(2)}s`;
+}
+
+/**
+ * @param {import('../types/vite-plugin-svelte-stats.d.ts').PackageStats[]} pkgStats
+ * @returns {string}
+ */
+function formatPackageStats(pkgStats) {
+	const statLines = pkgStats.map((pkgStat) => {
+		const duration = pkgStat.duration;
+		const avg = duration / pkgStat.files;
+		return [pkgStat.pkg, `${pkgStat.files}`, humanDuration(duration), humanDuration(avg)];
+	});
+	statLines.unshift(['package', 'files', 'time', 'avg']);
+	const columnWidths = statLines.reduce(
+		(widths, row) => {
+			for (let i = 0; i < row.length; i++) {
+				const cell = row[i];
+				if (widths[i] < cell.length) {
+					widths[i] = cell.length;
+				}
+			}
+			return widths;
+		},
+		statLines[0].map(() => 0)
+	);
+
+	const table = statLines
+		.map((row) =>
+			row
+				.map((cell, i) => {
+					if (i === 0) {
+						return cell.padEnd(columnWidths[i], ' ');
+					} else {
+						return cell.padStart(columnWidths[i], ' ');
+					}
+				})
+				.join('\t')
+		)
+		.join('\n');
+	return table;
+}
+
+/**
+ * @class
+ */
+export class VitePluginSvelteStats {
+	/** @type {PackageInfo[]} */
+	#packageInfos = [];
+
+	/** @type {import('../types/vite-plugin-svelte-stats.d.ts').StatCollection[]} */
+	#collections = [];
+
+	/**
+	 * @param {string} name
+	 * @param {Partial<import('../types/vite-plugin-svelte-stats.d.ts').CollectionOptions>} [opts]
+	 * @returns {import('../types/vite-plugin-svelte-stats.d.ts').StatCollection}
+	 */
+	startCollection(name, opts) {
+		const options = {
+			...defaultCollectionOptions,
+			...opts
+		};
+		/** @type {import('../types/vite-plugin-svelte-stats.d.ts').Stat[]} */
+		const stats = [];
+		const collectionStart = performance.now();
+
+		const _this = this;
+		let hasLoggedProgress = false;
+		/** @type {import('../types/vite-plugin-svelte-stats.d.ts').StatCollection} */
+		const collection = {
+			name,
+			options,
+			stats,
+			collectionStart,
+			finished: false,
+			start(file) {
+				if (collection.finished) {
+					throw new Error('called after finish() has been used');
+				}
+				file = normalizePath(file);
+				const start = performance.now();
+				/** @type {import('../types/vite-plugin-svelte-stats.d.ts').Stat} */
+				const stat = { file, start, end: start };
+				return () => {
+					const now = performance.now();
+					stat.end = now;
+					stats.push(stat);
+					if (!hasLoggedProgress && options.logInProgress(collection, now)) {
+						hasLoggedProgress = true;
+						log.debug(`${name} in progress ...`, undefined, 'stats');
+					}
+				};
+			},
+			async finish() {
+				await _this.#finish(collection);
+			}
+		};
+		_this.#collections.push(collection);
+		return collection;
+	}
+
+	async finishAll() {
+		await Promise.all(this.#collections.map((c) => c.finish()));
+	}
+
+	/**
+	 * @param {import('../types/vite-plugin-svelte-stats.d.ts').StatCollection} collection
+	 */
+	async #finish(collection) {
+		try {
+			collection.finished = true;
+			const now = performance.now();
+			collection.duration = now - collection.collectionStart;
+			const logResult = collection.options.logResult(collection);
+			if (logResult) {
+				await this.#aggregateStatsResult(collection);
+				log.debug(
+					`${collection.name} done.\n${formatPackageStats(
+						/** @type {import('../types/vite-plugin-svelte-stats.d.ts').PackageStats[]}*/ (
+							collection.packageStats
+						)
+					)}`,
+					undefined,
+					'stats'
+				);
+			}
+			// cut some ties to free it for garbage collection
+			const index = this.#collections.indexOf(collection);
+			this.#collections.splice(index, 1);
+			collection.stats.length = 0;
+			collection.stats = [];
+			if (collection.packageStats) {
+				collection.packageStats.length = 0;
+				collection.packageStats = [];
+			}
+			collection.start = () => () => {};
+			collection.finish = () => {};
+		} catch (e) {
+			// this should not happen, but stats taking also should not break the process
+			log.debug.once(`failed to finish stats for ${collection.name}\n`, e, 'stats');
+		}
+	}
+
+	/**
+	 * @param {import('../types/vite-plugin-svelte-stats.d.ts').StatCollection} collection
+	 */
+	async #aggregateStatsResult(collection) {
+		const stats = collection.stats;
+		for (const stat of stats) {
+			stat.pkg = (await this.#getPackageInfo(stat.file)).name;
+		}
+
+		// group stats
+		/** @type {Record<string, import('../types/vite-plugin-svelte-stats.d.ts').PackageStats>} */
+		const grouped = {};
+		stats.forEach((stat) => {
+			const pkg = /** @type {string} */ (stat.pkg);
+			let group = grouped[pkg];
+			if (!group) {
+				group = grouped[pkg] = {
+					files: 0,
+					duration: 0,
+					pkg
+				};
+			}
+			group.files += 1;
+			group.duration += stat.end - stat.start;
+		});
+
+		const groups = Object.values(grouped);
+		groups.sort((a, b) => b.duration - a.duration);
+		collection.packageStats = groups;
+	}
+	/**
+	 * @param {string} file
+	 * @returns {Promise<PackageInfo>}
+	 */
+	async #getPackageInfo(file) {
+		let info = this.#packageInfos.find((pi) => file.startsWith(pi.path));
+		if (!info) {
+			info = await findPackageInfo(file);
+			this.#packageInfos.push(info);
+		}
+		return info;
+	}
+}
+
+/**
+ * @typedef {{
+ * 	name: string;
+ * 	version: string;
+ * 	svelte?: string;
+ * 	path: string;
+ * }} PackageInfo
+ */
+
+/**
+ * utility to get some info from the closest package.json with a "name" set
+ *
+ * @param {string} file to find info for
+ * @returns {Promise<PackageInfo>}
+ */
+async function findPackageInfo(file) {
+	/** @type {PackageInfo} */
+	const info = {
+		name: '$unknown',
+		version: '0.0.0-unknown',
+		path: '$unknown'
+	};
+	let path = await findClosestPkgJsonPath(file, (pkgPath) => {
+		const pkg = JSON.parse(readFileSync(pkgPath, 'utf-8'));
+		if (pkg.name != null) {
+			info.name = pkg.name;
+			if (pkg.version != null) {
+				info.version = pkg.version;
+			}
+			info.svelte = pkg.svelte;
+			return true;
+		}
+		return false;
+	});
+	// return normalized path with appended '/' so .startsWith works for future file checks
+	path = normalizePath(dirname(path ?? file)) + '/';
+	info.path = path;
+	return info;
+}

package/src/utils/watch.js

@@ -0,0 +1,95 @@
+import fs from 'node:fs';
+import { log } from './log.js';
+import { knownSvelteConfigNames } from './load-svelte-config.js';
+import path from 'node:path';
+
+/**
+ * @param {import('../types/options.d.ts').ResolvedOptions} options
+ * @returns {void}
+ */
+export function setupWatchers(options) {
+	const { server, configFile: svelteConfigFile } = options;
+	if (!server) {
+		return;
+	}
+	const { watcher, ws } = server;
+	const { root, server: serverConfig } = server.config;
+
+	/** @type {(filename: string) => void} */
+	const triggerViteRestart = (filename) => {
+		if (serverConfig.middlewareMode) {
+			// in middlewareMode we can't restart the server automatically
+			// show the user an overlay instead
+			const message =
+				'Svelte config change detected, restart your dev process to apply the changes.';
+			log.info(message, filename);
+			ws.send({
+				type: 'error',
+				err: { message, stack: '', plugin: 'vite-plugin-svelte', id: filename }
+			});
+		} else {
+			log.info(`svelte config changed: restarting vite server. - file: ${filename}`);
+			server.restart();
+		}
+	};
+
+	// collection of watcher listeners by event
+	/** @type {Record<string, Function[]>} */
+	const listenerCollection = {
+		add: [],
+		change: [],
+		unlink: []
+	};
+
+	if (svelteConfigFile !== false) {
+		// configFile false means we ignore the file and external process is responsible
+		const possibleSvelteConfigs = knownSvelteConfigNames.map((cfg) => path.join(root, cfg));
+		/** @type {(filename: string) => void} */
+		const restartOnConfigAdd = (filename) => {
+			if (possibleSvelteConfigs.includes(filename)) {
+				triggerViteRestart(filename);
+			}
+		};
+
+		/** @type {(filename: string) => void} */
+		const restartOnConfigChange = (filename) => {
+			if (filename === svelteConfigFile) {
+				triggerViteRestart(filename);
+			}
+		};
+
+		if (svelteConfigFile) {
+			listenerCollection.change.push(restartOnConfigChange);
+			listenerCollection.unlink.push(restartOnConfigChange);
+		} else {
+			listenerCollection.add.push(restartOnConfigAdd);
+		}
+	}
+
+	Object.entries(listenerCollection).forEach(([evt, listeners]) => {
+		if (listeners.length > 0) {
+			watcher.on(evt, (filename) => listeners.forEach((listener) => listener(filename)));
+		}
+	});
+}
+
+/**
+ * taken from vite utils
+ * @param {import('vite').FSWatcher} watcher
+ * @param {string | null} file
+ * @param {string} root
+ * @returns {void}
+ */
+export function ensureWatchedFile(watcher, file, root) {
+	if (
+		file &&
+		// only need to watch if out of root
+		!file.startsWith(root + '/') &&
+		// some rollup plugins use null bytes for private resolved Ids
+		!file.includes('\0') &&
+		fs.existsSync(file)
+	) {
+		// resolve file to normalized system path
+		watcher.add(path.resolve(file));
+	}
+}

package/types/index.d.ts

@@ -0,0 +1,228 @@
+declare module '@rsvelte/vite-plugin-svelte' {
+	import type { InlineConfig, ResolvedConfig } from 'vite';
+	import type { CompileOptions, Warning, PreprocessorGroup } from '@rsvelte/compiler';
+	import type { Options as InspectorOptions } from '@sveltejs/vite-plugin-svelte-inspector';
+	export type Options = Omit<SvelteConfig, 'vitePlugin'> & PluginOptionsInline;
+
+	interface PluginOptionsInline extends PluginOptions {
+		/**
+		 * Path to a svelte config file, either absolute or relative to Vite root
+		 *
+		 * set to `false` to ignore the svelte config file
+		 *
+		 * @see https://vitejs.dev/config/#root
+		 */
+		configFile?: string | false;
+	}
+
+	export interface PluginOptions {
+		/**
+		 * A `picomatch` pattern, or array of patterns, which specifies the files the plugin should
+		 * operate on. By default, all svelte files are included.
+		 *
+		 * @see https://github.com/micromatch/picomatch
+		 */
+		include?: Arrayable<string | RegExp>;
+		/**
+		 * A `picomatch` pattern, or array of patterns, which specifies the files to be ignored by the
+		 * plugin. By default, no files are ignored.
+		 *
+		 * @see https://github.com/micromatch/picomatch
+		 */
+		exclude?: Arrayable<string | RegExp>;
+		/**
+		 * Emit Svelte styles as virtual CSS files for Vite and other plugins to process
+		 *
+		 * @default true
+		 */
+		emitCss?: boolean;
+		/**
+		 * Enable or disable Hot Module Replacement.
+		 * Deprecated, use compilerOptions.hmr instead!
+		 *
+		 * @deprecated
+		 * @default true for development, always false for production
+		 */
+		hot?: boolean;
+
+		/**
+		 * Some Vite plugins can contribute additional preprocessors by defining `api.sveltePreprocess`.
+		 * If you don't want to use them, set this to true to ignore them all or use an array of strings
+		 * with plugin names to specify which.
+		 *
+		 * @default false
+		 */
+		ignorePluginPreprocessors?: boolean | string[];
+		/**
+		 * vite-plugin-svelte automatically handles excluding svelte libraries and reinclusion of their dependencies
+		 * in vite.optimizeDeps.
+		 *
+		 * `disableDependencyReinclusion: true` disables all reinclusions
+		 * `disableDependencyReinclusion: ['foo','bar']` disables reinclusions for dependencies of foo and bar
+		 *
+		 * This should be used for hybrid packages that contain both node and browser dependencies, eg Routify
+		 *
+		 * @default false
+		 */
+		disableDependencyReinclusion?: boolean | string[];
+		/**
+		 * Enable support for Vite's dependency optimization to prebundle Svelte libraries.
+		 *
+		 * To disable prebundling for a specific library, add it to `optimizeDeps.exclude`.
+		 *
+		 * @default true for dev, false for build
+		 */
+		prebundleSvelteLibraries?: boolean;
+		/**
+		 * toggle/configure Svelte Inspector
+		 *
+		 * @default unset for dev, always false for build
+		 */
+		inspector?: InspectorOptions | boolean;
+
+		/**
+		 * A function to update `compilerOptions` before compilation
+		 *
+		 * `data.filename` - The file to be compiled
+		 * `data.code` - The preprocessed Svelte code
+		 * `data.compileOptions` - The current compiler options
+		 *
+		 * To change part of the compiler options, return an object with the changes you need.
+		 *
+		 * @example
+		 * ```
+		 * ({ filename, compileOptions }) => {
+		 *   // Dynamically set runes mode per Svelte file
+		 *   if (forceRunesMode(filename) && !compileOptions.runes) {
+		 *     return { runes: true };
+		 *   }
+		 * }
+		 * ```
+		 */
+		dynamicCompileOptions?: (data: {
+			filename: string;
+			code: string;
+			compileOptions: Partial<CompileOptions>;
+		}) => Promise<Partial<CompileOptions> | void> | Partial<CompileOptions> | void;
+
+		/**
+		 * These options are considered experimental and breaking changes to them can occur in any release
+		 */
+		experimental?: ExperimentalOptions;
+	}
+
+	export interface SvelteConfig {
+		/**
+		 * A list of file extensions to be compiled by Svelte
+		 *
+		 * @default ['.svelte']
+		 */
+		extensions?: string[];
+		/**
+		 * An array of preprocessors to transform the Svelte source code before compilation
+		 *
+		 * @see https://svelte.dev/docs/svelte/svelte-compiler#PreprocessorGroup
+		 */
+		preprocess?: Arrayable<PreprocessorGroup>;
+		/**
+		 * The options to be passed to the Svelte compiler. A few options are set by default,
+		 * including `dev` and `css`. However, some options are non-configurable, like
+		 * `filename`, `format`, `generate`, and `cssHash` (in dev).
+		 *
+		 * @see https://svelte.dev/docs/svelte/svelte-compiler#CompileOptions
+		 */
+		compilerOptions?: Omit<CompileOptions, 'filename' | 'format' | 'generate'>;
+
+		/**
+		 * Handles warning emitted from the Svelte compiler
+		 *
+		 * warnings emitted for files in node_modules are logged at the debug level, to see them run
+		 * `DEBUG=vite-plugin-svelte:node-modules-onwarn pnpm build`
+		 *
+		 * @example
+		 * ```
+		 * (warning, defaultHandler) => {
+		 *   // ignore some warnings
+		 *   if (!['foo','bar'].includes(warning.code)) {
+		 *     defaultHandler(warning);
+		 *   }
+		 * }
+		 * ```
+		 *
+		 */
+		onwarn?: (warning: Warning, defaultHandler: (warning: Warning) => void) => void;
+		/**
+		 * Options for vite-plugin-svelte
+		 */
+		vitePlugin?: PluginOptions;
+	}
+
+	/**
+	 * These options are considered experimental and breaking changes to them can occur in any release
+	 */
+	interface ExperimentalOptions {
+		/**
+		 * send a websocket message with svelte compiler warnings during dev
+		 *
+		 */
+		sendWarningsToBrowser?: boolean;
+		/**
+		 * disable svelte field resolve warnings
+		 *
+		 * @default false
+		 */
+		disableSvelteResolveWarnings?: boolean;
+
+		/**
+		 * disable api.sveltePreprocess deprecation warnings
+		 *
+		 * @default false
+		 */
+		disableApiSveltePreprocessWarnings?: boolean;
+
+		compileModule?: CompileModuleOptions;
+	}
+
+	interface CompileModuleOptions {
+		/**
+		 * infix that must be present in filename
+		 * @default ['.svelte.']
+		 */
+		infixes?: string[];
+		/**
+		 * module extensions
+		 * @default ['.ts','.js']
+		 */
+		extensions?: string[];
+		include?: Arrayable<string | RegExp>;
+		exclude?: Arrayable<string | RegExp>;
+	}
+
+	type Arrayable<T> = T | T[];
+
+	export interface VitePreprocessOptions {
+		/**
+		 * preprocess script block with vite pipeline.
+		 * Since svelte5 this is not needed for typescript anymore
+		 *
+		 * @default false
+		 */
+		script?: boolean;
+		/**
+		 * preprocess style blocks with vite pipeline
+		 */
+		style?: boolean | InlineConfig | ResolvedConfig;
+	}
+	/**
+	 * returns a list of plugins to handle svelte files
+	 * plugins are named `vite-plugin-svelte:<task>`
+	 *
+	 * */
+	export function svelte(inlineOptions?: Partial<Options>): import("vite").Plugin[];
+	export function vitePreprocess(opts?: VitePreprocessOptions): import("@rsvelte/compiler").PreprocessorGroup;
+	export function loadSvelteConfig(viteConfig?: import("vite").UserConfig, inlineOptions?: Partial<Options>): Promise<Partial<SvelteConfig> | undefined>;
+
+	export {};
+}
+
+//# sourceMappingURL=index.d.ts.map