@sveltejs/kit 2.61.1 → 2.63.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltejs/kit",
-  "version": "2.61.1",
+  "version": "2.63.0",
   "description": "SvelteKit is the fastest way to build Svelte apps",
   "keywords": [
     "framework",
@@ -33,10 +33,10 @@
   },
   "devDependencies": {
     "@opentelemetry/api": "^1.0.0",
-    "@playwright/test": "^1.59.1",
+    "@playwright/test": "^1.60.0",
     "@sveltejs/vite-plugin-svelte": "^6.0.0-next.3",
     "@types/connect": "^3.4.38",
-    "@types/node": "^18.19.119",
+    "@types/node": "^18.19.130",
     "@types/set-cookie-parser": "^2.4.7",
     "dts-buddy": "^0.8.0",
     "jsdom": "^26.1.0",
@@ -76,6 +76,10 @@
     "#app/paths": {
       "browser": "./src/runtime/app/paths/client.js",
       "default": "./src/runtime/app/paths/server.js"
+    },
+    "#app/env/public": {
+      "browser": "./src/runtime/app/env/public/client.js",
+      "default": "./src/runtime/app/env/public/server.js"
     }
   },
   "exports": {
@@ -88,6 +92,13 @@
       "types": "./types/index.d.ts",
       "import": "./src/exports/internal/index.js"
     },
+    "./internal/env": {
+      "types": "./types/index.d.ts",
+      "import": "./src/exports/internal/env.js"
+    },
+    "./internal/types": {
+      "import": "./src/exports/internal/types.js"
+    },
     "./internal/server": {
       "types": "./types/index.d.ts",
       "import": "./src/exports/internal/server.js"

package/src/cli.js

@@ -4,6 +4,7 @@ import { parseArgs } from 'node:util';
 import colors from 'kleur';
 import { load_config } from './core/config/index.js';
 import { coalesce_to_error } from './utils/error.js';
+import { resolve_explicit_env_entry } from './core/env.js';
 
 /** @param {unknown} e */
 function handle_error(e) {
@@ -73,20 +74,45 @@ if (!command) {
 }
 
 if (command === 'sync') {
-	const config_files = ['js', 'ts']
-		.map((ext) => `svelte.config.${ext}`)
-		.filter((f) => fs.existsSync(f));
-	if (config_files.length === 0) {
-		console.warn(`Missing Svelte config file in ${process.cwd()} — skipping`);
-		process.exit(0);
+	// create placeholder .svelte-kit/tsconfig.json if necessary, to squelch warnings.
+	// this isn't bulletproof — if someone has some esoteric config, it will continue
+	// to harmlessly warn — but we handle the 90% case and clean up after ourselves
+	const sveltekit_dir = '.svelte-kit';
+	const base_tsconfig = `${sveltekit_dir}/tsconfig.json`;
+	const base_tsconfig_json = '{}';
+
+	const sveltekit_dir_exists = fs.existsSync(sveltekit_dir);
+	const base_tsconfig_exists = fs.existsSync(base_tsconfig);
+
+	if (!base_tsconfig_exists) {
+		try {
+			fs.mkdirSync('.svelte-kit');
+		} catch {
+			// ignore
+		}
+
+		fs.writeFileSync(base_tsconfig, base_tsconfig_json);
 	}
 
 	try {
 		const config = await load_config();
 		const sync = await import('./core/sync/sync.js');
 		sync.all_types(config, values.mode);
+
+		const explicit_env_entry = resolve_explicit_env_entry(config.kit);
+		await sync.env(config.kit, explicit_env_entry, values.mode);
 	} catch (error) {
 		handle_error(error);
+	} finally {
+		// if we errored, or accidentally created the wrong file
+		// (could happen!) then clean up after ourselves
+		if (fs.readFileSync(base_tsconfig, 'utf-8') === base_tsconfig_json) {
+			fs.unlinkSync(base_tsconfig);
+		}
+
+		if (!sveltekit_dir_exists && fs.readdirSync(sveltekit_dir).length === 0) {
+			fs.rmSync(sveltekit_dir, { recursive: true });
+		}
 	}
 } else {
 	console.error(colors.bold().red(`> Unknown command: ${command}`));

package/src/core/adapt/builder.js

@@ -1,8 +1,10 @@
+/** @import { StandardSchemaV1 } from '@standard-schema/spec' */
 /** @import { Builder } from '@sveltejs/kit' */
 /** @import { ResolvedConfig } from 'vite' */
-/** @import { RouteDefinition } from '@sveltejs/kit' */
+/** @import { RouteDefinition, EnvVarConfig } from '@sveltejs/kit' */
 /** @import { RouteData, ValidatedConfig, BuildData, ServerMetadata, ServerMetadataRoute, Prerendered, PrerenderMap, Logger, RemoteChunk } from 'types' */
 import colors from 'kleur';
+import * as devalue from 'devalue';
 import { createReadStream, createWriteStream, existsSync, statSync } from 'node:fs';
 import { extname, resolve, join, dirname, relative } from 'node:path';
 import { pipeline } from 'node:stream';
@@ -17,6 +19,7 @@ import { write } from '../sync/utils.js';
 import { list_files } from '../utils.js';
 import { find_server_assets } from '../generate_manifest/find_server_assets.js';
 import { reserved } from '../env.js';
+import { handle_issues, validate } from '../../exports/internal/env.js';
 
 const pipe = promisify(pipeline);
 const extensions = ['.html', '.js', '.mjs', '.json', '.css', '.svg', '.xml', '.wasm', '.txt'];
@@ -32,7 +35,8 @@ const extensions = ['.html', '.js', '.mjs', '.json', '.css', '.svg', '.xml', '.w
  *   prerender_map: PrerenderMap;
  *   log: Logger;
  *   vite_config: ResolvedConfig;
- *   remotes: RemoteChunk[]
+ *   remotes: RemoteChunk[];
+ *   explicit_env_config: Record<string, EnvVarConfig<any>> | null;
  * }} opts
  * @returns {Builder}
  */
@@ -45,7 +49,8 @@ export function create_builder({
 	prerender_map,
 	log,
 	vite_config,
-	remotes
+	remotes,
+	explicit_env_config
 }) {
 	/** @type {Map<RouteDefinition, RouteData>} */
 	const lookup = new Map();
@@ -168,7 +173,10 @@ export function create_builder({
 
 			const fallback = await generate_fallback({
 				manifest_path,
-				env: { ...env.private, ...env.public }
+				env: env.all,
+				out_dir: config.kit.outDir,
+				origin: config.kit.prerender.origin,
+				assets: config.kit.files.assets
 			});
 
 			if (existsSync(dest)) {
@@ -185,10 +193,28 @@ export function create_builder({
 		},
 
 		generateEnvModule() {
+			if (!build_data.client?.uses_env_dynamic_public) return;
+
 			const dest = `${config.kit.outDir}/output/prerendered/dependencies/${config.kit.appDir}/env.js`;
 			const env = get_env(config.kit.env, vite_config.mode);
 
-			write(dest, `export const env=${JSON.stringify(env.public)}`);
+			const values = config.kit.experimental.explicitEnvironmentVariables ? {} : env.public;
+
+			if (config.kit.experimental.explicitEnvironmentVariables) {
+				const variables = explicit_env_config ?? {};
+
+				/** @type {Record<string, StandardSchemaV1.Issue[]>} */
+				const issues = {};
+
+				for (const [name, config] of Object.entries(variables)) {
+					if (config.static || !config.public) continue;
+					values[name] = validate(variables, env.all[name], name, issues);
+				}
+
+				handle_issues(issues);
+			}
+
+			write(dest, `export const env=${devalue.uneval(values)}`);
 		},
 
 		generateManifest({ relativePath, routes: subset }) {

package/src/core/adapt/index.js

@@ -10,6 +10,7 @@ import { create_builder } from './builder.js';
  * @param {import('types').Logger} log
  * @param {import('types').RemoteChunk[]} remotes
  * @param {import('vite').ResolvedConfig} vite_config
+ * @param {Record<string, import('@sveltejs/kit').EnvVarConfig<any>> | null} explicit_env_config
  */
 export async function adapt(
 	config,
@@ -19,7 +20,8 @@ export async function adapt(
 	prerender_map,
 	log,
 	remotes,
-	vite_config
+	vite_config,
+	explicit_env_config
 ) {
 	// This is only called when adapter is truthy, so the cast is safe
 	const { name, adapt } = /** @type {import('@sveltejs/kit').Adapter} */ (config.kit.adapter);
@@ -35,7 +37,8 @@ export async function adapt(
 		prerender_map,
 		log,
 		remotes,
-		vite_config
+		vite_config,
+		explicit_env_config
 	});
 
 	await adapt(builder);

package/src/core/config/index.js

@@ -1,15 +1,19 @@
+/** @import { Config } from '@sveltejs/kit' */
+/** @import { ValidatedConfig } from 'types' */
+/** @import { ResolvedConfig } from 'vite' */
 import fs from 'node:fs';
 import path from 'node:path';
 import process from 'node:process';
 import * as url from 'node:url';
 import options from './options.js';
 import { resolve_entry } from '../../utils/filesystem.js';
+import { import_peer } from '../../utils/import.js';
 
 /**
  * Loads the template (src/app.html by default) and validates that it has the
  * required content.
  * @param {string} cwd
- * @param {import('types').ValidatedConfig} config
+ * @param {ValidatedConfig} config
  */
 export function load_template(cwd, { kit }) {
 	const { env, files } = kit;
@@ -29,11 +33,13 @@ export function load_template(cwd, { kit }) {
 		}
 	});
 
-	for (const match of contents.matchAll(/%sveltekit\.env\.([^%]+)%/g)) {
-		if (!match[1].startsWith(env.publicPrefix)) {
-			throw new Error(
-				`Environment variables in ${relative} must start with ${env.publicPrefix} (saw %sveltekit.env.${match[1]}%)`
-			);
+	if (!kit.experimental.explicitEnvironmentVariables) {
+		for (const match of contents.matchAll(/%sveltekit\.env\.([^%]+)%/g)) {
+			if (!match[1].startsWith(env.publicPrefix)) {
+				throw new Error(
+					`Environment variables in ${relative} must start with ${env.publicPrefix} (saw %sveltekit.env.${match[1]}%)`
+				);
+			}
 		}
 	}
 
@@ -43,7 +49,7 @@ export function load_template(cwd, { kit }) {
 /**
  * Loads the error page (src/error.html by default) if it exists.
  * Falls back to a generic error page content.
- * @param {import('types').ValidatedConfig} config
+ * @param {ValidatedConfig} config
  */
 export function load_error_page(config) {
 	let { errorTemplate } = config.kit.files;
@@ -58,11 +64,34 @@ export function load_error_page(config) {
 }
 
 /**
- * Loads and validates Svelte config file
+ * Loads and validates Svelte config file. Tries Vite config first, falls back to svelte.config.js
  * @param {{ cwd?: string }} options
- * @returns {Promise<import('types').ValidatedConfig>}
+ * @returns {Promise<ValidatedConfig>}
  */
 export async function load_config({ cwd = process.cwd() } = {}) {
+	try {
+		const vite_config = await load_config_from_vite({ cwd });
+		if (vite_config) {
+			return vite_config;
+		}
+	} catch (e) {
+		// TODO SvelteKit 3: fail completely instead
+		console.error(
+			'Loading Svelte config from Vite config failed:',
+			e,
+			'\n\nFalling back to loading svelte.config.js'
+		);
+	}
+
+	return load_svelte_config(cwd);
+}
+
+/**
+ * Loads and validates Svelte config file
+ * @param {string} [cwd]
+ * @returns {Promise<ValidatedConfig>}
+ */
+export async function load_svelte_config(cwd = process.cwd()) {
 	const config_files = ['js', 'ts']
 		.map((ext) => path.join(cwd, `svelte.config.${ext}`))
 		.filter((f) => fs.existsSync(f));
@@ -73,52 +102,87 @@ export async function load_config({ cwd = process.cwd() } = {}) {
 		);
 		return process_config({}, { cwd });
 	}
+
 	const config_file = config_files[0];
 	if (config_files.length > 1) {
 		console.log(
 			`Found multiple Svelte config files in ${cwd}: ${config_files.map((f) => path.basename(f)).join(', ')}. Using ${path.basename(config_file)}`
 		);
 	}
+
 	const config = await import(`${url.pathToFileURL(config_file).href}?ts=${Date.now()}`);
+	return process_config(config.default, { cwd, source: path.relative(cwd, config_file) });
+}
 
-	try {
-		return process_config(config.default, { cwd });
-	} catch (e) {
-		const error = /** @type {Error} */ (e);
+/**
+ * Loads and validates Svelte config via Vite config resolution (if set that way).
+ * @param {{ cwd?: string; mode?: string }} options
+ * @returns {Promise<ValidatedConfig | undefined>}
+ */
+async function load_config_from_vite({ cwd = process.cwd(), mode } = {}) {
+	const { resolveConfig } = await import_peer('vite');
+	const current_cwd = process.cwd();
 
-		// redact the stack trace — it's not helpful to users
-		error.stack = `Could not load ${config_file}: ${error.message}\n`;
-		throw error;
+	if (cwd !== current_cwd) {
+		process.chdir(cwd);
+	}
+
+	/** @type {ResolvedConfig} */
+	let resolved;
+
+	try {
+		resolved = await resolveConfig({}, 'build', mode ?? process.env.MODE ?? 'production');
+	} finally {
+		if (cwd !== current_cwd) {
+			process.chdir(current_cwd);
+		}
 	}
+
+	const plugin = resolved.plugins.find(
+		(plugin) => plugin.name === 'vite-plugin-sveltekit-setup' && plugin.api?.options
+	);
+
+	return plugin?.api.options;
 }
 
 /**
- * @param {import('@sveltejs/kit').Config} config
- * @returns {import('types').ValidatedConfig}
+ * @param {Config} config
+ * @returns {ValidatedConfig}
  */
-function process_config(config, { cwd = process.cwd() } = {}) {
-	const validated = validate_config(config, cwd);
-
-	validated.kit.outDir = path.resolve(cwd, validated.kit.outDir);
-
-	for (const key in validated.kit.files) {
-		if (key === 'hooks') {
-			validated.kit.files.hooks.client = path.resolve(cwd, validated.kit.files.hooks.client);
-			validated.kit.files.hooks.server = path.resolve(cwd, validated.kit.files.hooks.server);
-			validated.kit.files.hooks.universal = path.resolve(cwd, validated.kit.files.hooks.universal);
-		} else {
-			// @ts-expect-error
-			validated.kit.files[key] = path.resolve(cwd, validated.kit.files[key]);
+export function process_config(config, { cwd = process.cwd(), source = 'svelte.config.js' } = {}) {
+	try {
+		const validated = validate_config(config, cwd);
+
+		validated.kit.outDir = path.resolve(cwd, validated.kit.outDir);
+
+		for (const key in validated.kit.files) {
+			if (key === 'hooks') {
+				validated.kit.files.hooks.client = path.resolve(cwd, validated.kit.files.hooks.client);
+				validated.kit.files.hooks.server = path.resolve(cwd, validated.kit.files.hooks.server);
+				validated.kit.files.hooks.universal = path.resolve(
+					cwd,
+					validated.kit.files.hooks.universal
+				);
+			} else {
+				// @ts-expect-error
+				validated.kit.files[key] = path.resolve(cwd, validated.kit.files[key]);
+			}
 		}
-	}
 
-	return validated;
+		return validated;
+	} catch (e) {
+		const error = /** @type {Error} */ (e);
+
+		// redact the stack trace — it's not helpful to users
+		error.stack = `Error loading ${source}: ${error.message}\n`;
+		throw error;
+	}
 }
 
 /**
- * @param {import('@sveltejs/kit').Config} config
+ * @param {Config} config
  * @param {string} [cwd]
- * @returns {import('types').ValidatedConfig}
+ * @returns {ValidatedConfig}
  */
 export function validate_config(config, cwd = process.cwd()) {
 	if (typeof config !== 'object') {
@@ -127,7 +191,7 @@ export function validate_config(config, cwd = process.cwd()) {
 		);
 	}
 
-	/** @type {import('types').ValidatedConfig} */
+	/** @type {ValidatedConfig} */
 	const validated = options(config, 'config');
 	const files = validated.kit.files;
 

package/src/core/config/options.js

@@ -139,6 +139,7 @@ const options = object(
 				instrumentation: object({
 					server: boolean(false)
 				}),
+				explicitEnvironmentVariables: boolean(false),
 				remoteFunctions: boolean(false),
 				forkPreloads: boolean(false),
 				handleRenderingErrors: boolean(false)