@sveltejs/kit 3.0.0-next.24 → 3.0.0-next.27

package/src/exports/vite/plugins/env-vars.js

@@ -2,6 +2,7 @@
 /** @import { EnvVarConfig } from '@sveltejs/kit/env' */
 /** @import { ValidatedConfig } from 'types' */
 import path from 'node:path';
+import { exactRegex } from '@rolldown/pluginutils';
 import * as sync from '../../../core/sync/sync.js';
 import { create_env_modules, resolve_env_entry } from '../../../core/env.js';
 import { import_peer } from '../../../utils/import.js';
@@ -26,9 +27,6 @@ export function plugin_env_vars(config, callback) {
 	/** @type {ResolvedConfig} */
 	let resolved_config;
 
-	/** @type {string | null} */
-	let resolved_entry = null;
-
 	/** @type {Set<string>} */
 	let deps = new Set();
 
@@ -38,12 +36,8 @@ export function plugin_env_vars(config, callback) {
 	let generated;
 
 	async function generate() {
-		const synced = await sync.env(
-			config,
-			resolved_entry,
-			resolved_config.root,
-			resolved_config.mode
-		);
+		const entry = resolve_env_entry(config, resolved_config.root);
+		const synced = await sync.env(config, entry, resolved_config.root, resolved_config.mode);
 
 		deps = synced.deps;
 
@@ -55,7 +49,7 @@ export function plugin_env_vars(config, callback) {
 			vars,
 			env,
 			dir,
-			resolved_entry && posixify(path.relative(dir, resolved_entry)),
+			entry && posixify(path.relative(dir, entry)),
 			!is_build
 		);
 
@@ -84,34 +78,59 @@ export function plugin_env_vars(config, callback) {
 			// runs once via the memo — per-process, whichever environment starts first
 			// (environment names vary by adapter), and never in the postbuild forks,
 			// which resolve the config without building
-			await (generated ??= (async () => {
-				resolved_entry = resolve_env_entry(config, resolved_config.root);
-				await generate();
-			})());
+			await (generated ??= generate());
 		},
 
-		configureServer(server) {
-			// `handleHotUpdate` only fires for `change` events on files Vite already knows about,
-			// so it doesn't cover the env entry being created or deleted while the dev server is
-			// running. Watch for those events explicitly, re-resolve the entry, regenerate the
-			// modules and trigger a full reload (mirroring the previous behaviour).
-			const on_entry_add_unlink = async (/** @type {string} */ file) => {
-				const resolved = resolve_env_entry(config, resolved_config.root);
-
-				if (file === resolved_entry || file === resolved) {
-					resolved_entry = resolved;
-					await generate();
-					server.hot.send({ type: 'full-reload' });
-				}
-			};
-
-			server.watcher.on('add', on_entry_add_unlink);
-			server.watcher.on('unlink', on_entry_add_unlink);
-		},
+		async hotUpdate({ type, file }) {
+			// runs for every environment; the generated modules are shared, so do the work once
+			if (this.environment.name !== 'client') return;
+
+			const created = type === 'create' && file === resolve_env_entry(config, resolved_config.root);
+			if (!deps.has(file) && !created) return;
 
-		async handleHotUpdate(update) {
-			if (!deps.has(update.file)) return;
 			await generate();
+			if (type !== 'update') this.environment.hot.send({ type: 'full-reload' });
 		}
 	};
 }
+
+/**
+ * @param {() => string | null} get_service_worker_entry_file
+ * @returns {Plugin}
+ */
+export function plugin_service_worker_env_vars(get_service_worker_entry_file) {
+	/** @type {string | null} */
+	let service_worker_entry_file;
+
+	/** @satisfies {Plugin} */
+	const plugin = {
+		name: 'vite-plugin-sveltekit-service-worker-env',
+		configResolved() {
+			service_worker_entry_file = get_service_worker_entry_file();
+
+			if (service_worker_entry_file) {
+				plugin.transform.filter = {
+					id: exactRegex(service_worker_entry_file)
+				};
+			}
+		},
+		applyToEnvironment(environment) {
+			return !!service_worker_entry_file && environment.config.consumer === 'client';
+		},
+		transform: {
+			filter: {},
+			handler(code) {
+				// prepend the service worker with an import that configures
+				// `env`, in case `$app/env/public` is imported. In production
+				// this is required: dynamic public env vars aren't known at
+				// build time, so `env.js` is loaded at runtime. In dev, the
+				// imported module just inlines the current values instead.
+				return {
+					code: `import '<sveltekit:generated>/env/service-worker.js';\n${code}`
+				};
+			}
+		}
+	};
+
+	return plugin;
+}

package/src/exports/vite/plugins/guard.js

@@ -0,0 +1,217 @@
+/** @import { TopLevelFilterExpression } from '@rolldown/pluginutils' */
+/** @import { ManifestData, ValidatedConfig } from 'types' */
+/** @import { Plugin } from 'vite' */
+import path from 'node:path';
+import { and, exactRegex, importerId, include, not } from '@rolldown/pluginutils';
+import { app_env_private, app_server } from '../module_ids.js';
+import {
+	error_for_missing_config,
+	normalize_id,
+	remote_module_pattern,
+	server_only_directory_pattern,
+	server_only_module_pattern
+} from '../utils.js';
+import { stackless } from '../../../utils/error.js';
+import { posixify } from '../../../utils/os.js';
+
+/**
+ * Ensures that client-side code can't accidentally import server-side code,
+ * whether in `*.server.js` files, `$app/server`, any `/server/` directory, or `$app/env/private`
+ * @param {ValidatedConfig} kit
+ * @param {() => { vite: typeof import('vite'); root: string; normalized_aliases: Array<{ alias: string, path: string }>; service_worker_entry_file: string | null; }} get_config
+ * @param {() => ManifestData} get_manifest_data
+ * @returns {Plugin}
+ */
+export function plugin_guard(kit, get_config, get_manifest_data) {
+	/** @type {string} */
+	let root;
+
+	/** @type {string} */
+	let normalized_cwd;
+	/** @type {Array<{ alias: string, path: string }>} */
+	let normalized_aliases;
+	/** @type {string} */
+	let normalized_node_modules;
+	/** @type {string} */
+	let normalized_routes;
+	/** @type {string} */
+	let normalized_assets;
+
+	/** @type {string | null} */
+	let service_worker_entry_file;
+
+	/** @type {Map<string, Set<string>>} */
+	const import_map = new Map();
+
+	return {
+		name: 'vite-plugin-sveltekit-guard',
+
+		// Run this plugin before built-in resolution, so that relative imports
+		// are added to the module graph
+		enforce: 'pre',
+
+		configResolved() {
+			/** @type {typeof import('vite')} */
+			let vite;
+			({ vite, root, normalized_aliases, service_worker_entry_file } = get_config());
+
+			normalized_cwd = vite.normalizePath(root);
+			normalized_node_modules = vite.normalizePath(path.resolve(root, 'node_modules'));
+			normalized_routes = vite.normalizePath(path.resolve(root, kit.files.routes));
+			normalized_assets = vite.normalizePath(path.resolve(root, kit.files.assets));
+		},
+
+		applyToEnvironment(environment) {
+			// the import map is only read for client-side violations in `load`, so skip other environments
+			return environment.config.consumer === 'client';
+		},
+
+		resolveId: {
+			// composable filters are not accepted type-wise but still work during build
+			// see https://github.com/vitejs/rolldown-vite/issues/605
+			filter: /** @type {any} */ (
+				/** @satisfies {TopLevelFilterExpression[]} */ ([
+					include(and(importerId(/.+/), not(importerId(/index\.html$/))))
+				])
+			),
+			async handler(id, importer, options) {
+				// composable filters only work during build so we still need this guard for dev
+				// see https://github.com/vitejs/rolldown-vite/issues/605
+				if (importer && !importer.endsWith('index.html')) {
+					const resolved = await this.resolve(id, importer, options);
+
+					if (resolved) {
+						const normalized = normalize_id(resolved.id, normalized_aliases, normalized_cwd);
+
+						let importers = import_map.get(normalized);
+
+						if (!importers) {
+							importers = new Set();
+							import_map.set(normalized, importers);
+						}
+
+						importers.add(normalize_id(importer, normalized_aliases, normalized_cwd));
+					}
+				}
+			}
+		},
+
+		load: {
+			filter: {
+				id: [
+					exactRegex(app_server),
+					exactRegex(app_env_private),
+					server_only_module_pattern,
+					server_only_directory_pattern
+				]
+			},
+			handler(id) {
+				const normalized = normalize_id(id, normalized_aliases, normalized_cwd);
+
+				let is_server_only = normalized === '$app/env/private' || normalized === '$app/server';
+
+				// skip .server.js files outside the cwd or in node_modules, as the filename might not mean 'server-only module' in this context
+				if (id.startsWith(normalized_cwd + '/') && !id.startsWith(normalized_node_modules + '/')) {
+					// e.g. `server.ts` or `foo.server.ts`
+					is_server_only ||= server_only_module_pattern.test(id);
+
+					// e.g. `server/foo.ts`, unless in `src/routes` or `static`
+					is_server_only ||=
+						server_only_directory_pattern.test(id) &&
+						!id.startsWith(normalized_routes + '/') &&
+						!id.startsWith(normalized_assets + '/');
+				}
+
+				if (!is_server_only) return;
+
+				const manifest_data = get_manifest_data();
+
+				/** @type {Set<string>} */
+				const entrypoints = new Set();
+
+				/**
+				 * Entrypoints must be normalized like the import map keys, or files
+				 * outside the project root (e.g. hooks) would never match an importer
+				 * @param {string} file - absolute, or relative to the project root
+				 */
+				const add_entrypoint = (file) => {
+					entrypoints.add(
+						normalize_id(posixify(path.resolve(root, file)), normalized_aliases, normalized_cwd)
+					);
+				};
+
+				for (const node of manifest_data.nodes) {
+					if (node.component) add_entrypoint(node.component);
+					if (node.universal) add_entrypoint(node.universal);
+				}
+
+				if (manifest_data.hooks.client) add_entrypoint(manifest_data.hooks.client);
+				if (manifest_data.hooks.universal) add_entrypoint(manifest_data.hooks.universal);
+
+				if (service_worker_entry_file) {
+					add_entrypoint(service_worker_entry_file);
+				}
+
+				// Walk up the import graph from the server-only module, looking for a chain
+				// that leads back to a client entrypoint. We search all candidates (not just
+				// the first) because a module can be imported by both server and client code,
+				// and a greedy first-match could follow a server-only branch that never
+				// reaches an entrypoint — see https://github.com/sveltejs/kit/issues/16232
+				/** @type {Set<string>} */
+				const visited = new Set([normalized]);
+
+				/**
+				 * @param {string} current
+				 * @param {string[]} chain
+				 * @returns {string[] | null}
+				 */
+				function find_chain(current, chain) {
+					const importers = import_map.get(current);
+					if (!importers) return null;
+
+					for (const importer of importers) {
+						if (visited.has(importer)) continue;
+						visited.add(importer);
+
+						const next_chain = [...chain, importer];
+						if (entrypoints.has(importer)) {
+							return next_chain;
+						}
+						const result = find_chain(importer, next_chain);
+						if (result) return result;
+					}
+					return null;
+				}
+
+				const chain = find_chain(normalized, [normalized]);
+
+				if (chain) {
+					if (chain.some((id) => remote_module_pattern.test(id))) {
+						error_for_missing_config('remote functions', 'experimental.remoteFunctions', 'true');
+					}
+
+					const pyramid = chain
+						.reverse()
+						.map((id, i) => {
+							return `${' '.repeat(i + 1)}${id}`;
+						})
+						.join(' imports\n');
+
+					let message = `Cannot import ${normalized} into code that runs in the browser, as this could leak sensitive information.`;
+					message += `\n\n${pyramid}`;
+					message += `\n\nIf you're only using the import as a type, change it to \`import type\`.`;
+
+					throw stackless(message);
+				}
+
+				// No chain from this server-only module to a client entrypoint was found —
+				// the module is only imported from server code, which is valid.
+			}
+		},
+
+		// avoid watch mode rebuilds using stale import map data
+		buildEnd() {
+			import_map.clear();
+		}
+	};
+}

package/src/exports/vite/plugins/remote.js

@@ -0,0 +1,237 @@
+/** @import { RemoteChunk, RemoteInternals, ServerMetadata, ValidatedConfig } from 'types' */
+/** @import { Plugin, ViteDevServer } from 'vite' */
+import path from 'node:path';
+import { prefixRegex } from '@rolldown/pluginutils';
+import MagicString from 'magic-string';
+import { error_for_missing_config, is_remote_module, remote_module_pattern } from '../utils.js';
+import { create_exported_declarations } from '../../../core/env.js';
+import { dedent } from '../../../core/sync/utils.js';
+import { runtime_directory } from '../../../core/utils.js';
+import { get_runner } from '../../../runner.js';
+import { hash } from '../../../utils/hash.js';
+import { s } from '../../../utils/misc.js';
+import { posixify } from '../../../utils/os.js';
+
+/**
+ * @param {ValidatedConfig} svelte_config
+ * @param {() => { root: string; vite: typeof import('vite'); }} get_config
+ * @param {() => ServerMetadata | null} get_build_metadata
+ * @param {(remote_metadata: {remotes: RemoteChunk[]; remote_original_by_hash: Map<string, string>}) => void} set_remote_metadata
+ * @returns {Plugin}
+ */
+export function plugin_remote(svelte_config, get_config, get_build_metadata, set_remote_metadata) {
+	/** @type {string} */
+	let root;
+	/** @type {typeof import('vite')} */
+	let vite;
+
+	/** @type {ViteDevServer} */
+	let dev_server;
+
+	/** @type {ServerMetadata | null} */
+	let build_metadata;
+
+	/** @type {RemoteChunk[]} */
+	let remotes = [];
+
+	/** @type {Map<string, string>} Maps remote hash -> original module id */
+	const remote_original_by_hash = new Map();
+	/** @type {Set<string>} Track which remote hashes have already been emitted */
+	const emitted_remote_hashes = new Set();
+
+	return {
+		name: 'vite-plugin-sveltekit-remote',
+
+		configResolved() {
+			({ root, vite } = get_config());
+		},
+
+		configureServer(_dev_server) {
+			dev_server = _dev_server;
+		},
+
+		applyToEnvironment(environment) {
+			return svelte_config.experimental.remoteFunctions && environment.name !== 'serviceWorker';
+		},
+
+		perEnvironmentStartEndDuringDev: true,
+
+		buildStart() {
+			// avoid stale data when building with watch mode
+			if (this.meta.watchMode && this.environment.config.consumer === 'server') {
+				remotes = [];
+				remote_original_by_hash.clear();
+				emitted_remote_hashes.clear();
+			}
+
+			build_metadata = get_build_metadata();
+			set_remote_metadata({ remotes, remote_original_by_hash });
+		},
+
+		// prevent other plugins from resolving our remote virtual module
+		resolveId: {
+			filter: {
+				id: prefixRegex('\0sveltekit-remote:')
+			},
+			handler(id) {
+				return id;
+			}
+		},
+
+		load: {
+			filter: {
+				id: prefixRegex('\0sveltekit-remote:')
+			},
+			handler(id) {
+				// On-the-fly generated entry point for remote file just forwards the original module
+				// We're not using manualChunks because it can cause problems with circular dependencies
+				// (e.g. https://github.com/sveltejs/kit/issues/14679) and module ordering in general
+				// (e.g. https://github.com/sveltejs/kit/issues/14590).
+				const hash_id = id.slice('\0sveltekit-remote:'.length);
+				const original = remote_original_by_hash.get(hash_id);
+				if (!original) throw new Error(`Expected to find metadata for remote file ${id}`);
+				return `import * as m from ${s(original)};\nexport default m;`;
+			}
+		},
+
+		transform: {
+			filter: {
+				id: remote_module_pattern
+			},
+			async handler(code, id) {
+				if (!is_remote_module(id)) return;
+
+				const file = posixify(path.relative(root, id));
+				const remote = {
+					hash: hash(file),
+					file
+				};
+
+				if (this.environment.config.consumer === 'server') {
+					remotes.push(remote);
+
+					// we need to add an `await Promise.resolve()` because if the user imports this function
+					// on the client AND in a load function when loading the client module we will trigger
+					// an import during dev. During a link preload, the module can be mistakenly
+					// loaded and transformed twice and the first time all its exports would be undefined
+					// triggering a dev server error. By adding a microtask we ensure that the module is fully loaded
+					const ms = new MagicString(code);
+
+					// Extra newlines to prevent syntax errors around missing semicolons or comments
+					ms.append(
+						'\n\n' +
+							dedent`
+								import * as $$_self_$$ from './${path.basename(id)}';
+								import { init_remote_functions as $$_init_$$ } from '@sveltejs/kit/internal/server';
+
+								${dev_server ? 'await Promise.resolve()' : ''}
+
+								$$_init_$$($$_self_$$, ${s(file)}, ${s(remote.hash)});
+
+								for (const [name, fn] of Object.entries($$_self_$$)) {
+									fn.__.id = ${s(remote.hash)} + '/' + name;
+									fn.__.name = name;
+								}
+							`
+					);
+
+					// Emit a dedicated entry chunk for this remote in SSR builds (prod only)
+					if (!dev_server) {
+						remote_original_by_hash.set(remote.hash, id);
+
+						if (!emitted_remote_hashes.has(remote.hash)) {
+							this.emitFile({
+								type: 'chunk',
+								id: `\0sveltekit-remote:${remote.hash}`,
+								name: `remote-${remote.hash}`
+							});
+							emitted_remote_hashes.add(remote.hash);
+						}
+					}
+
+					return {
+						code: ms.toString(),
+						map: ms.generateMap({ hires: 'boundary' })
+					};
+				}
+
+				// For the client, read the exports and create a new module that only contains fetch functions with the correct metadata
+
+				/** @type {Map<string, RemoteInternals['type']>} */
+				const map = new Map();
+
+				// in dev, load the server module here (which will result in this hook
+				// being called again with `opts.ssr === true` if the module isn't
+				// already loaded) so we can determine what it exports
+				if (dev_server) {
+					const module = await get_runner(vite, dev_server).import(id);
+
+					for (const [name, value] of Object.entries(module)) {
+						const type = value?.__?.type;
+						if (type) map.set(name, type);
+					}
+				}
+				// in prod, we already built and analysed the server code before
+				// building the client code, so `remotes` is populated
+				else if (build_metadata?.remotes) {
+					const exports = build_metadata.remotes.get(remote.hash);
+					if (!exports) throw new Error('Expected to find metadata for remote file ' + id);
+
+					for (const [name, value] of exports) {
+						map.set(name, value.type);
+					}
+				}
+
+				const { namespace, declarations, reexports } = create_exported_declarations(
+					map.keys(),
+					(name, ns) => `${ns}.${map.get(name)}('${remote.hash}/${name}')`,
+					'__remote'
+				);
+
+				const relative = posixify(
+					path.relative(path.dirname(id), `${runtime_directory}/client/remote-functions/index.js`)
+				);
+
+				let result = `import * as ${namespace} from '${relative}';\n\n${declarations.join('\n')}`;
+				if (reexports.length > 0) {
+					result += `\nexport { ${reexports.join(', ')} };`;
+				}
+				result += '\n';
+
+				if (dev_server) {
+					result += `\nimport.meta.hot?.accept();\n`;
+				}
+
+				return {
+					code: result,
+					map: null
+				};
+			}
+		}
+	};
+}
+
+/**
+ * @param {ValidatedConfig} svelte_config
+ * @returns {Plugin}
+ */
+export function plugin_remote_guard(svelte_config) {
+	return {
+		name: 'vite-plugin-sveltekit-remote-guard',
+
+		applyToEnvironment() {
+			return !svelte_config.experimental.remoteFunctions;
+		},
+
+		transform: {
+			filter: {
+				id: new RegExp(
+					`.remote(${svelte_config.moduleExtensions.join('|')})$`.replaceAll('.', '\\.')
+				)
+			},
+			handler() {
+				error_for_missing_config('remote functions', 'experimental.remoteFunctions', 'true');
+			}
+		}
+	};
+}

package/src/exports/vite/preview/index.js

@@ -1,5 +1,5 @@
 /** @import { NextHandleFunction } from 'connect' */
-/** @import { PreviewServer, ResolvedConfig } from 'vite' */
+/** @import { PreviewServer } from 'vite' */
 /** @import { ValidatedConfig, ServerInternalModule, ServerModule } from 'types' */
 import fs from 'node:fs';
 import { join } from 'node:path';
@@ -15,15 +15,14 @@ import { stackless } from '../../../utils/error.js';
 
 /**
  * @param {PreviewServer} vite
- * @param {ResolvedConfig} vite_config
  * @param {ValidatedConfig} svelte_config
  */
-export async function preview(vite, vite_config, svelte_config) {
+export async function preview(vite, svelte_config) {
 	const { paths } = svelte_config;
 	const base = paths.base;
 	const assets = paths.assets ? SVELTE_KIT_ASSETS : paths.base;
 
-	const protocol = vite_config.preview.https ? 'https' : 'http';
+	const protocol = vite.config.preview.https ? 'https' : 'http';
 
 	const etag = `"${Date.now()}"`;
 
@@ -44,6 +43,7 @@ export async function preview(vite, vite_config, svelte_config) {
 	/** @type {ServerModule} */
 	const { Server } = await import(pathToFileURL(join(dir, 'index.js')).href);
 
+	/** @type {{ manifest: import('types').SSRManifest }} */
 	const { manifest } = await import(pathToFileURL(join(dir, 'manifest.js')).href);
 
 	set_assets(assets);
@@ -52,7 +52,7 @@ export async function preview(vite, vite_config, svelte_config) {
 
 	try {
 		await server.init({
-			env: loadEnv(vite_config.mode, svelte_config.env.dir, ''),
+			env: loadEnv(vite.config.mode, svelte_config.env.dir, ''),
 			read: (file) => createReadableStream(`${dir}/${file}`)
 		});
 	} catch (error) {
@@ -205,13 +205,13 @@ export async function preview(vite, vite_config, svelte_config) {
 		vite.middlewares.use(async (req, res) => {
 			const host = req.headers[':authority'] || req.headers.host;
 
-			const request = getRequest({
+			const request = (svelte_config.adapter?.vite?.getRequest ?? getRequest)({
 				base: `${protocol}://${host}`,
 				request: req,
 				response: res
 			});
 
-			setResponse(
+			(svelte_config.adapter?.vite?.setResponse ?? setResponse)(
 				res,
 				await server.respond(request, {
 					getClientAddress: () => {
@@ -220,7 +220,7 @@ export async function preview(vite, vite_config, svelte_config) {
 						throw new Error('Could not determine clientAddress');
 					},
 					read: (file) => {
-						if (file in manifest._.server_assets) {
+						if (file in manifest.server_assets) {
 							return fs.readFileSync(join(dir, file));
 						}