feat: log warning if svelte field causes difference in resolve

.changeset/cold-horses-begin.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/vite-plugin-svelte': patch
+---
+
+log deprecation warnings for packages that use the "svelte" field to resolve svelte files differently than standard vite resolve

docs/faq.md

@@ -177,3 +177,32 @@ There is no golden rule, but you can follow these recommendations:
 
 This warning only occurs if you use non-default settings in your vite config that can cause problems in combination with prebundleSvelteLibraries.
 You should not use prebundleSvelteLibraries during build or for ssr, disable one of the incompatible options to make that warning (and subsequent errors) go away.
+
+<!-- the following header generates an anchor that is used in logging, do not modify!-->
+
+### deprecated "svelte" field
+
+In the past, Svelte recommended using the custom "svelte" field in package.json to allow libraries to point at .svelte source files.
+This field requires a custom implementation to resolve, so you have to use a bundler plugin and this plugin needs to implement resolving.
+Since then, node has added support for [conditional exports](https://nodejs.org/api/packages.html#conditional-exports), which have more generic support in bundlers and node itself. So to increase the compatibility with the wider ecosystem and reduce the implementation needs for current and future bundler plugins, it is recommended that packages use the "svelte" exports condition.
+
+Example:
+
+```diff
+// package.json
+- "svelte": "src/index.js"
++ "exports": {
++   "./package.json": "./package.json",
++   "./*": {
++     "svelte": "./src/*",
++   },
++   ".": {
++     "svelte": "./index.js"
++   }
+  }
+```
+
+> **Support for the svelte field is deprecated and is going to be removed in a future version of vite-plugin-svelte.**
+>
+> Library authors are highly encouraged to update their packages to the new exports condition as outlined above. Check out
+> [svelte-package](https://kit.svelte.dev/docs/packaging) which already supports it.

packages/vite-plugin-svelte/src/index.ts

@@ -23,6 +23,7 @@ import { toRollupError } from './utils/error';
 import { saveSvelteMetadata } from './utils/optimizer';
 import { svelteInspector } from './ui/inspector/plugin';
 import { VitePluginSvelteCache } from './utils/vite-plugin-svelte-cache';
+import { FAQ_LINK_DEPRECATED_SVELTE_FIELD } from './utils/constants';
 
 interface PluginAPI {
 	/**
@@ -76,7 +77,7 @@ export function svelte(inlineOptions?: Partial<Options>): Plugin[] {
 			},
 
 			async configResolved(config) {
-				options = resolveOptions(options, config);
+				options = resolveOptions(options, config, cache);
 				patchResolvedViteConfig(config, options);
 				requestParser = buildIdParser(options);
 				compileSvelte = createCompileSvelte(options);
@@ -167,13 +168,35 @@ export function svelte(inlineOptions?: Partial<Options>): Plugin[] {
 				// for ssr, during scanning and non-prebundled, we do it
 				if (ssr || scan || !isPrebundled) {
 					try {
+						const isFirstResolve = !cache.hasResolvedSvelteField(importee, importer);
 						const resolved = await resolveViaPackageJsonSvelte(importee, importer, cache);
-						if (resolved) {
-							log.debug(
-								`resolveId resolved ${resolved} via package.json svelte field of ${importee}`
+						if (isFirstResolve && resolved) {
+							const packageInfo = await cache.getPackageInfo(resolved);
+							log.debug.once(
+								`resolveId resolved ${importee} to ${resolved} via package.json svelte field of ${packageInfo.name}@${packageInfo.version}`
 							);
-							return resolved;
+							const logDeprecationWarning = (error?: Error | string) => {
+								const prefix = `DEPRECATION WARNING: ${packageInfo.name}@${packageInfo.version} package.json has \`"svelte":"${packageInfo.svelte}"\``;
+								const reason = error
+									? ' and without it resolve would fail with the following error:'
+									: ' and vite would resolve differently without it.';
+								const secondLine = `Packages should use the "svelte" exports condition instead. See ${FAQ_LINK_DEPRECATED_SVELTE_FIELD} for more information.`;
+								log.warn.once(`${prefix}${reason}\n${secondLine}`, error);
+							};
+							try {
+								const viteResolved = (
+									await this.resolve(importee, importer, { ...opts, skipSelf: true })
+								)?.id;
+								if (resolved !== viteResolved) {
+									logDeprecationWarning(
+										`'${importee}' resolved to '${resolved}' but vite would resolve to '${viteResolved}'`
+									);
+								}
+							} catch (e) {
+								logDeprecationWarning(e);
+							}
 						}
+						return resolved;
 					} catch (e) {
 						log.debug.once(
 							`error trying to resolve ${importee} from ${importer} via package.json svelte field `,

packages/vite-plugin-svelte/src/utils/compile.ts

@@ -113,6 +113,7 @@ const _createCompileSvelte = (makeHot: Function) => {
 			compiled.js.code = makeHot({
 				id: filename,
 				compiledCode: compiled.js.code,
+				// @ts-expect-error hot isn't a boolean anymore at this point
 				hotOptions: { ...options.hot, injectCss: options.hot?.injectCss === true && hasCss },
 				compiled,
 				originalCode: code,

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

@@ -20,3 +20,6 @@ export const SVELTE_HMR_IMPORTS = [
 ];
 
 export const SVELTE_EXPORT_CONDITIONS = ['svelte'];
+
+export const FAQ_LINK_DEPRECATED_SVELTE_FIELD =
+	'https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/faq.md#deprecated-svelte-field';

packages/vite-plugin-svelte/src/utils/log.ts

@@ -73,7 +73,7 @@ function createLogger(level: string): LogFn {
 	const logFn: LogFn = _log.bind(null, logger) as LogFn;
 	const logged = new Set<String>();
 	const once = function (message: string, payload?: any) {
-		if (logged.has(message)) {
+		if (!logger.enabled || logged.has(message)) {
 			return;
 		}
 		logged.add(message);

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

@@ -33,6 +33,7 @@ import {
 import { atLeastSvelte } from './svelte-version';
 import { isCommonDepWithoutSvelteField } from './dependencies';
 import { VitePluginSvelteStats } from './vite-plugin-svelte-stats';
+import { VitePluginSvelteCache } from './vite-plugin-svelte-cache';
 
 // svelte 3.53.0 changed compilerOptions.css from boolean to string | boolen, use string when available
 const cssAsString = atLeastSvelte('3.53.0');
@@ -180,7 +181,8 @@ function mergeConfigs<T>(...configs: (Partial<T> | undefined)[]): T {
 // also validates the final config.
 export function resolveOptions(
 	preResolveOptions: PreResolvedOptions,
-	viteConfig: ResolvedConfig
+	viteConfig: ResolvedConfig,
+	cache: VitePluginSvelteCache
 ): ResolvedOptions {
 	const css = cssAsString
 		? preResolveOptions.emitCss
@@ -217,7 +219,7 @@ export function resolveOptions(
 	const statsEnabled =
 		disableCompileStats !== true && disableCompileStats !== (merged.isBuild ? 'build' : 'dev');
 	if (statsEnabled && isLogLevelInfo) {
-		merged.stats = new VitePluginSvelteStats();
+		merged.stats = new VitePluginSvelteStats(cache);
 	}
 	return merged;
 }

packages/vite-plugin-svelte/src/utils/vite-plugin-svelte-cache.ts

@@ -1,5 +1,17 @@
 import { SvelteRequest } from './id';
 import { Code, CompileData } from './compile';
+import { readFileSync } from 'fs';
+import { dirname } from 'path';
+//eslint-disable-next-line node/no-missing-import
+import { findClosestPkgJsonPath } from 'vitefu';
+import { normalizePath } from 'vite';
+
+interface PackageInfo {
+	name: string;
+	version: string;
+	svelte?: string;
+	path: string;
+}
 
 export class VitePluginSvelteCache {
 	private _css = new Map<string, Code>();
@@ -8,6 +20,7 @@ export class VitePluginSvelteCache {
 	private _dependants = new Map<string, Set<string>>();
 	private _resolvedSvelteFields = new Map<string, string>();
 	private _errors = new Map<string, any>();
+	private _packageInfos: PackageInfo[] = [];
 
 	public update(compileData: CompileData) {
 		this._errors.delete(compileData.normalizedFilename);
@@ -110,6 +123,9 @@ export class VitePluginSvelteCache {
 		return this._resolvedSvelteFields.get(this._getResolvedSvelteFieldKey(name, importer));
 	}
 
+	public hasResolvedSvelteField(name: string, importer?: string) {
+		return this._resolvedSvelteFields.has(this._getResolvedSvelteFieldKey(name, importer));
+	}
 	public setResolvedSvelteField(
 		importee: string,
 		importer: string | undefined = undefined,
@@ -124,4 +140,43 @@ export class VitePluginSvelteCache {
 	private _getResolvedSvelteFieldKey(importee: string, importer?: string): string {
 		return importer ? `${importer} > ${importee}` : importee;
 	}
+
+	public async getPackageInfo(file: string): Promise<PackageInfo> {
+		let info = this._packageInfos.find((pi) => file.startsWith(pi.path));
+		if (!info) {
+			info = await findPackageInfo(file);
+			this._packageInfos.push(info);
+		}
+		return info;
+	}
+}
+
+/**
+ * utility to get some info from the package.json a file belongs to (closest one with a "name" set)
+ *
+ * @param {string} file to find info for
+ * @returns {PackageInfo}
+ */
+async function findPackageInfo(file: string): Promise<PackageInfo> {
+	const info: PackageInfo = {
+		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;
 }

packages/vite-plugin-svelte/src/utils/vite-plugin-svelte-stats.ts

@@ -1,10 +1,7 @@
 import { log } from './log';
-//eslint-disable-next-line node/no-missing-import
-import { findClosestPkgJsonPath } from 'vitefu';
-import { readFileSync } from 'fs';
-import { dirname } from 'path';
 import { performance } from 'perf_hooks';
 import { normalizePath } from 'vite';
+import { VitePluginSvelteCache } from './vite-plugin-svelte-cache';
 
 interface Stat {
 	file: string;
@@ -87,31 +84,13 @@ function formatPackageStats(pkgStats: PackageStats[]) {
 	return table;
 }
 
-/**
- * utility to get the package name a file belongs to
- *
- * @param {string} file to find package for
- * @returns {path:string,name:string} tuple of path,name where name is the parsed package name and path is the normalized path to it
- */
-async function getClosestNamedPackage(file: string): Promise<{ name: string; path: string }> {
-	let name = '$unknown';
-	let path = await findClosestPkgJsonPath(file, (pkgPath) => {
-		const pkg = JSON.parse(readFileSync(pkgPath, 'utf-8'));
-		if (pkg.name != null) {
-			name = pkg.name;
-			return true;
-		}
-		return false;
-	});
-	// return normalized path with appended '/' so .startsWith works for future file checks
-	path = normalizePath(dirname(path ?? file)) + '/';
-	return { name, path };
-}
-
 export class VitePluginSvelteStats {
 	// package directory -> package name
-	private _packages: { path: string; name: string }[] = [];
+	private _cache: VitePluginSvelteCache;
 	private _collections: StatCollection[] = [];
+	constructor(cache: VitePluginSvelteCache) {
+		this._cache = cache;
+	}
 	startCollection(name: string, opts?: Partial<CollectionOptions>) {
 		const options = {
 			...defaultCollectionOptions,
@@ -186,12 +165,7 @@ export class VitePluginSvelteStats {
 	private async _aggregateStatsResult(collection: StatCollection) {
 		const stats = collection.stats;
 		for (const stat of stats) {
-			let pkg = this._packages.find((p) => stat.file.startsWith(p.path));
-			if (!pkg) {
-				pkg = await getClosestNamedPackage(stat.file);
-				this._packages.push(pkg);
-			}
-			stat.pkg = pkg.name;
+			stat.pkg = (await this._cache.getPackageInfo(stat.file)).name;
 		}
 
 		// group stats