@sveltejs/kit 3.0.0-next.11 → 3.0.0-next.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sveltejs/kit",
-  "version": "3.0.0-next.11",
+  "version": "3.0.0-next.12",
   "description": "SvelteKit is the fastest way to build Svelte apps",
   "keywords": [
     "framework",

package/src/cli.js

@@ -75,19 +75,19 @@ if (!command) {
 }
 
 if (command === 'sync') {
-	// create placeholder .svelte-kit/tsconfig.json if necessary, to squelch warnings.
+	// create placeholder node_modules/$app/tsconfig/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 dir = 'node_modules/$app/tsconfig';
+	const base_tsconfig = `${dir}/tsconfig.json`;
 	const base_tsconfig_json = '{}';
 
-	const sveltekit_dir_exists = fs.existsSync(sveltekit_dir);
+	const sveltekit_dir_exists = fs.existsSync(dir);
 	const base_tsconfig_exists = fs.existsSync(base_tsconfig);
 
 	if (!base_tsconfig_exists) {
 		try {
-			fs.mkdirSync('.svelte-kit');
+			fs.mkdirSync(dir, { recursive: true });
 		} catch {
 			// ignore
 		}
@@ -100,7 +100,7 @@ if (command === 'sync') {
 		const sveltekit_config = extract_svelte_config(vite_config);
 
 		const sync = await import('./core/sync/sync.js');
-		sync.all_types(sveltekit_config);
+		sync.all_types(sveltekit_config, vite_config.root);
 
 		const explicit_env_entry = resolve_explicit_env_entry(sveltekit_config.kit);
 		await sync.env(sveltekit_config.kit, explicit_env_entry, vite_config.root, values.mode);
@@ -113,8 +113,8 @@ if (command === 'sync') {
 			fs.unlinkSync(base_tsconfig);
 		}
 
-		if (!sveltekit_dir_exists && fs.readdirSync(sveltekit_dir).length === 0) {
-			fs.rmSync(sveltekit_dir, { recursive: true });
+		if (!sveltekit_dir_exists && fs.readdirSync(dir).length === 0) {
+			fs.rmSync(dir, { recursive: true });
 		}
 	}
 } else {

package/src/constants.js

@@ -4,7 +4,7 @@
  */
 export const SVELTE_KIT_ASSETS = '/_svelte_kit_assets';
 
-export const GENERATED_COMMENT = '// this file is generated — do not edit it\n';
+export const GENERATED_COMMENT = '// this file is generated — do not edit it';
 
 export const ENDPOINT_METHODS = ['GET', 'POST', 'PUT', 'PATCH', 'DELETE', 'OPTIONS', 'HEAD'];
 

package/src/core/config/options.js

@@ -1,6 +1,7 @@
 /** @import { SvelteConfig } from '@sveltejs/vite-plugin-svelte' */
 /** @import { ValidatedKitConfig } from 'types' */
 /** @import { Validator } from './types.js' */
+import { styleText } from 'node:util';
 
 const directives = object({
 	'child-src': string_array(),
@@ -77,17 +78,21 @@ export const validate_kit_options = object({
 		return input;
 	}),
 
-	alias: validate({}, (input, keypath) => {
-		if (typeof input !== 'object') {
-			throw new Error(`${keypath} should be an object`);
-		}
+	alias: deprecate(
+		validate({}, (input, keypath) => {
+			if (typeof input !== 'object') {
+				throw new Error(`${keypath} should be an object`);
+			}
 
-		for (const key in input) {
-			assert_string(input[key], `${keypath}.${key}`);
-		}
+			for (const key in input) {
+				assert_string(input[key], `${keypath}.${key}`);
+			}
 
-		return input;
-	}),
+			return input;
+		}),
+		(keypath) =>
+			`The \`${keypath}\` option is deprecated, and will be removed in a future version of SvelteKit. Use subpath imports instead: https://svelte.dev/docs/kit/$lib`
+	),
 
 	appDir: validate('_app', (input, keypath) => {
 		assert_string(input, keypath);
@@ -270,47 +275,50 @@ export const validate_kit_options = object({
 	}),
 
 	serviceWorker: object({
+		files: removed(),
 		register: boolean(true),
 		// options could be undefined but if it is defined we only validate that
 		// it's an object since the type comes from the browser itself
-		options: validate(undefined, object({}, true)),
-		files: fun((filename) => !/\.DS_Store/.test(filename))
+		options: validate(undefined, object({}, true))
 	}),
 
 	tracing: object({
 		server: boolean(false)
 	}),
 
-	typescript: object({
-		config: fun((config) => config)
-	}),
+	typescript: deprecate(
+		object({
+			config: fun((config) => config)
+		}),
+		(keypath) => {
+			return `The \`${keypath}\` option is deprecated, and will be removed in a future version. Add configuration to tsconfig.json directly`;
+		}
+	),
 
 	version: object({
 		name: string(Date.now().toString()),
-		pollInterval: number(0)
+		pollInterval: number(3_600_000)
 	})
 });
 
-// /**
-//  * @param {Validator} fn
-//  * @param {(keypath: string) => string} get_message
-//  * @returns {Validator}
-//  */
-// function deprecate(
-// 	fn,
-// 	get_message = (keypath) =>
-// 		`The \`${keypath}\` option is deprecated, and will be removed in a future version`
-// ) {
-// 	return (input, keypath) => {
-//		keypath = remove_kit_prefix(keypath);
-//
-// 		if (input !== undefined) {
-// 			console.warn(styleText(['bold', 'yellow'], get_message(keypath)));
-// 		}
-
-// 		return fn(input, keypath);
-// 	};
-// }
+/**
+ * @param {Validator} fn
+ * @param {(keypath: string) => string} get_message
+ * @returns {Validator}
+ */
+function deprecate(
+	fn,
+	get_message = (keypath) =>
+		`The \`${keypath}\` option is deprecated, and will be removed in a future version`
+) {
+	return (input, keypath) => {
+		if (input !== undefined) {
+			console.warn(styleText(['bold', 'yellow'], get_message(keypath)));
+		}
+
+		return fn(input, keypath);
+	};
+}
 
 // Derive the names of SvelteKit's own config options from the schema, so they
 // stay in sync automatically. These are used to separate Kit's options from

package/src/core/env.js

@@ -10,6 +10,7 @@ import { runtime_directory } from './utils.js';
 import { resolve_entry } from '../utils/filesystem.js';
 import { handle_issues, validate } from '../exports/internal/env.js';
 import { get_config_aliases } from '../exports/vite/utils.js';
+import { get_runner } from '../runner.js';
 
 /**
  * @typedef {'public' | 'private'} EnvType
@@ -52,12 +53,14 @@ export async function load_explicit_env(kit, file, root, mode) {
 	/** @type {Record<string, EnvVarConfig<any>>} */
 	let variables;
 
+	const runner = get_runner(server);
+
 	/** @type {import('../runtime/app/env/internal.js')} */ (
-		await server.ssrLoadModule(`${runtime_directory}/app/env/internal.js`)
+		await runner.import(`${runtime_directory}/app/env/internal.js`)
 	).set_building();
 
 	try {
-		({ variables } = await server.ssrLoadModule(file));
+		({ variables } = await runner.import(file));
 
 		if (!variables || typeof variables !== 'object') {
 			throw new Error(`${file} must export a variables object`);
@@ -238,25 +241,35 @@ export function create_sveltekit_env_public(variables, env, prelude) {
  * `env.js`. If there are none, values are inlined.
  * @param {Record<string, EnvVarConfig<any>> | null} variables
  * @param {Record<string, string>} env
+ * @param {string} version
  * @param {string} global
  * @param {string} base
  * @param {string} app_dir
  */
-export function create_sveltekit_env_service_worker(variables, env, global, base, app_dir) {
+export function create_sveltekit_env_service_worker(
+	variables,
+	env,
+	version,
+	global,
+	base,
+	app_dir
+) {
 	const has_dynamic_public_env = Object.values(variables ?? {}).some(
 		(config) => config.public && !config.static
 	);
 
 	if (!has_dynamic_public_env) {
-		return create_sveltekit_env_service_worker_dev(variables, env, global);
+		return create_sveltekit_env_service_worker_dev(variables, env, version, global);
 	}
 
 	return dedent`
 		import { env } from '${base}/${app_dir}/env.js';
 
-		globalThis.__SVELTEKIT_EXPERIMENTAL_EXPLICIT_ENVIRONMENT_VARIABLES__ = true;
-
-		${global} = { env };
+		${global} = {
+			base: location.pathname.split('/').slice(0, -1).join('/'),
+			env,
+			version: ${JSON.stringify(version)}
+		};
 	`;
 }
 
@@ -264,9 +277,10 @@ export function create_sveltekit_env_service_worker(variables, env, global, base
  * Creates the `__sveltekit/env/service-worker` module used in development
  * @param {Record<string, EnvVarConfig<any>> | null} variables
  * @param {Record<string, string>} env
+ * @param {string} version
  * @param {string} global
  */
-export function create_sveltekit_env_service_worker_dev(variables, env, global) {
+export function create_sveltekit_env_service_worker_dev(variables, env, version, global) {
 	/** @type {string[]} */
 	const properties = [];
 
@@ -283,12 +297,12 @@ export function create_sveltekit_env_service_worker_dev(variables, env, global)
 	handle_issues(issues);
 
 	return dedent`
-		globalThis.__SVELTEKIT_EXPERIMENTAL_EXPLICIT_ENVIRONMENT_VARIABLES__ = true;
-
 		${global} = {
+			base: location.pathname.split('/').slice(0, -1).join('/'),
 			env: {
 				${properties.join(',\n\t\t') || '// empty'}
-			}
+			},
+			version: ${JSON.stringify(version)}
 		};
 	`;
 }

package/src/core/sync/sync.js

@@ -1,11 +1,9 @@
 import path from 'node:path';
-import process from 'node:process';
 import create_manifest_data from './create_manifest_data/index.js';
 import { write_client_manifest } from './write_client_manifest.js';
-import { write_tsconfig } from './write_tsconfig.js';
+import { write_tsconfig } from './write_tsconfig/index.js';
 import { write_types, write_all_types } from './write_types/index.js';
-import { write_ambient } from './write_ambient.js';
-import { write_non_ambient } from './write_non_ambient.js';
+import { write_app_types } from './write_app_types.js';
 import { write_server } from './write_server.js';
 import {
 	create_node_analyser,
@@ -21,7 +19,6 @@ import { write_env } from './write_env.js';
  */
 export function init(config, root) {
 	write_tsconfig(config.kit, root);
-	write_ambient(config.kit);
 }
 
 /**
@@ -37,7 +34,7 @@ export function create(config, root) {
 	write_client_manifest(config.kit, manifest_data, `${output}/client`);
 	write_server(config, output, root);
 	write_all_types(config, manifest_data, root);
-	write_non_ambient(config.kit, manifest_data);
+	write_app_types(config.kit, manifest_data, root);
 
 	return { manifest_data };
 }
@@ -65,7 +62,7 @@ export function update(config, manifest_data, file, root) {
 	}
 
 	write_types(config, manifest_data, file, root);
-	write_non_ambient(config.kit, manifest_data);
+	write_app_types(config.kit, manifest_data, root);
 }
 
 /**
@@ -81,13 +78,13 @@ export function all(config, root) {
 /**
  * Run sync.init and then generate all type files.
  * @param {import('types').ValidatedConfig} config
+ * @param {string} root
  */
-export function all_types(config) {
-	const cwd = process.cwd();
-	init(config, cwd);
-	const manifest_data = create_manifest_data({ config, cwd });
-	write_all_types(config, manifest_data, cwd);
-	write_non_ambient(config.kit, manifest_data);
+export function all_types(config, root) {
+	init(config, root);
+	const manifest_data = create_manifest_data({ config, cwd: root });
+	write_all_types(config, manifest_data, root);
+	write_app_types(config.kit, manifest_data, root);
 }
 
 /**
@@ -100,7 +97,7 @@ export function all_types(config) {
 export async function env(kit, entry, root, mode) {
 	const env_config = await load_explicit_env(kit, entry, root, mode);
 
-	write_env(kit, entry, env_config);
+	write_env(entry, env_config, root);
 
 	return env_config;
 }

package/src/core/sync/utils.js

@@ -1,6 +1,7 @@
 import fs from 'node:fs';
 import path from 'node:path';
-import { mkdirp } from '../../utils/filesystem.js';
+import { styleText } from 'node:util';
+import { mkdirp, resolve_entry } from '../../utils/filesystem.js';
 
 /** @type {Map<string, string>} */
 const previous_contents = new Map();
@@ -68,3 +69,22 @@ export function dedent(strings, ...values) {
 
 	return str;
 }
+
+/**
+ * @param {string} original
+ * @param {string} typo The common misspelling to check for
+ * @param {string} description What was wrong with the filename
+ */
+export function check_spelling(original, typo, description) {
+	const misspelled = resolve_entry(typo);
+	if (!misspelled) return;
+
+	const corrected = path.basename(misspelled).replace(path.basename(typo), path.basename(original));
+
+	console.warn(
+		styleText(
+			['bold', 'yellow'],
+			`${description}. Did you mean ${corrected}?` + ` at ${path.resolve(misspelled)}`
+		)
+	);
+}

package/src/core/sync/{write_non_ambient.js → write_app_types.js}

@@ -22,10 +22,6 @@ const remove_group_segments = (/** @type {string} */ id) => {
  * @returns {string[]}
  */
 function get_pathnames_for_trailing_slash(pathname, route) {
-	if (pathname === '/') {
-		return [pathname];
-	}
-
 	/** @type {Set<string>} */
 	const pathnames = new Set();
 
@@ -55,8 +51,6 @@ function get_pathnames_for_trailing_slash(pathname, route) {
 // people could use to type their own components.
 // The T generic is needed or else there's a "all declarations must have identical type parameters" error.
 const template = `
-${GENERATED_COMMENT}
-
 declare module "svelte/elements" {
 	export interface HTMLAttributes<T> {
 		'data-sveltekit-keepfocus'?: true | false | '' | undefined | null;
@@ -76,16 +70,15 @@ declare module "svelte/elements" {
 		'data-sveltekit-replacestate'?: true | false | '' | undefined | null;
 	}
 }
-
-export {};
 `;
 
 /**
  * Generate app types interface extension
  * @param {import('types').ManifestData} manifest_data
  * @param {import('types').ValidatedKitConfig} config
+ * @param {string} dir
  */
-function generate_app_types(manifest_data, config) {
+function generate_app_types(manifest_data, config, dir) {
 	/** @type {Map<string, string>} */
 	const matcher_types = new Map();
 
@@ -100,7 +93,7 @@ function generate_app_types(manifest_data, config) {
 					resolve_entry(config.files.params) ??
 					config.files.params.replace(/\.(js|ts)$/, '') + '.js';
 
-				return posixify(path.relative(config.outDir, params_file));
+				return posixify(path.relative(dir, params_file));
 			};
 
 			type = `import('@sveltejs/kit').MatcherParam<(typeof import('${path_to_params()}').params)[${JSON.stringify(matcher)}]>`;
@@ -201,7 +194,7 @@ function generate_app_types(manifest_data, config) {
 
 	for (const route of manifest_data.routes) {
 		const pathname = remove_group_segments(route.id);
-		let normalized_pathname = pathname;
+		let normalized_pathname = pathname.slice(1);
 
 		/** @type {(path: string) => string} */
 		let serialise = s;
@@ -215,7 +208,7 @@ function generate_app_types(manifest_data, config) {
 
 			dynamic_routes.push(route_type);
 
-			normalized_pathname = replace_required_params(replace_optional_params(pathname));
+			normalized_pathname = replace_required_params(replace_optional_params(pathname)).slice(1);
 			serialise = (p) => `\`${p}\` & {}`;
 		}
 
@@ -240,7 +233,7 @@ function generate_app_types(manifest_data, config) {
 		layouts.push(`${s(route.id)}: ${layout_type}`);
 	}
 
-	const assets = manifest_data.assets.map((asset) => s('/' + asset.file));
+	const assets = manifest_data.assets.map((asset) => s(asset.file));
 
 	return [
 		'declare module "$app/types" {',
@@ -248,22 +241,31 @@ function generate_app_types(manifest_data, config) {
 		`\t\tRouteId(): ${manifest_data.routes.map((r) => s(r.id)).join(' | ')};`,
 		`\t\tRouteParams(): {\n\t\t\t${dynamic_routes.join(';\n\t\t\t')}\n\t\t};`,
 		`\t\tLayoutParams(): {\n\t\t\t${layouts.join(';\n\t\t\t')}\n\t\t};`,
-		`\t\tPathname(): ${Array.from(pathnames).join(' | ')};`,
-		'\t\tResolvedPathname(): `${"" | `/${string}`}${ReturnType<AppTypes[\'Pathname\']>}`;',
-		`\t\tAsset(): ${assets.concat('string & {}').join(' | ')};`,
+		`\t\tPath(): ${Array.from(pathnames).join(' | ')};`,
+		'\t\tResolvedPathname(): `${"/" | `/${string}/`}${ReturnType<AppTypes[\'Path\']>}`;',
+		`\t\tAssetPath(): ${assets.join(' | ') || 'never'};`,
 		'\t}',
 		'}'
 	].join('\n');
 }
 
 /**
- * Writes non-ambient declarations to the output directory
+ * Writes `node_modules/$app/types/index.d.ts`. This file contains
+ * declarations for `$app/types` and `svelte/elements`, and
+ * imports `env.ts` which declares `$app/env/(public|private)`
  * @param {import('types').ValidatedKitConfig} config
  * @param {import('types').ManifestData} manifest_data
+ * @param {string} root
  */
-export function write_non_ambient(config, manifest_data) {
-	const app_types = generate_app_types(manifest_data, config);
-	const content = [template, app_types].join('\n\n');
+export function write_app_types(config, manifest_data, root) {
+	const dir = path.join(root, 'node_modules/$app/types');
+
+	const content = [
+		GENERATED_COMMENT,
+		`import '@sveltejs/kit';\nimport './env';`,
+		generate_app_types(manifest_data, config, dir),
+		template.trim()
+	].join('\n\n');
 
-	write_if_changed(path.join(config.outDir, 'non-ambient.d.ts'), content);
+	write_if_changed(path.join(dir, 'index.d.ts'), content);
 }

package/src/core/sync/write_client_manifest.js

@@ -1,8 +1,6 @@
-import path from 'node:path';
-import { styleText } from 'node:util';
+import { check_spelling, dedent, write_if_changed } from './utils.js';
 import { relative_path, resolve_entry } from '../../utils/filesystem.js';
 import { s } from '../../utils/misc.js';
-import { dedent, write_if_changed } from './utils.js';
 
 /**
  * Writes the client manifest to disk. The manifest is used to power the router. It contains the
@@ -123,15 +121,9 @@ export function write_client_manifest(kit, manifest_data, output, metadata) {
 	const client_hooks_file = resolve_entry(kit.files.hooks.client);
 	const universal_hooks_file = resolve_entry(kit.files.hooks.universal);
 
-	const typo = resolve_entry('src/+hooks.client');
-	if (typo) {
-		console.log(
-			styleText(
-				['bold', 'yellow'],
-				`Unexpected + prefix. Did you mean ${typo.split('/').at(-1)?.slice(1)}?` +
-					` at ${path.resolve(typo)}`
-			)
-		);
+	if (!client_hooks_file) {
+		check_spelling('src/hooks.client', 'src/+hooks.client', 'Unexpected + prefix');
+		check_spelling('src/hooks.client', 'src/hook.client', 'Missing s suffix');
 	}
 
 	// Stringified version of

package/src/core/sync/write_env.js

@@ -10,16 +10,18 @@ const DOCS = '// See https://svelte.dev/docs/kit/environment-variables for more
  * Writes ambient declarations including types reference to @sveltejs/kit,
  * and the existing environment variables in process.env to
  * $env/static/private and $env/static/public
- * @param {import('types').ValidatedKitConfig} kit
  * @param {string | null} entry
  * @param {Record<string, EnvVarConfig<any>> | null} env_config
+ * @param {string} root
  */
-export function write_env(kit, entry, env_config) {
+export function write_env(entry, env_config, root) {
 	const content = [];
-	const out = path.join(kit.outDir, 'env.d.ts');
+
+	const dir = path.join(root, 'node_modules/$app/types');
+	const out = path.join(dir, 'env.d.ts');
 
 	if (entry && env_config) {
-		const relative = posixify(path.relative(kit.outDir, entry));
+		const relative = posixify(path.relative(dir, entry));
 		content.push(
 			`// This file is generated from ${relative}.\n${DOCS}`,
 			create_explicit_env_types(env_config, relative, 'private'),

package/src/core/sync/write_server.js

@@ -1,11 +1,10 @@
 import path from 'node:path';
-import { styleText } from 'node:util';
 import { hash } from '../../utils/hash.js';
 import { resolve_entry } from '../../utils/filesystem.js';
 import { posixify } from '../../utils/os.js';
 import { s } from '../../utils/misc.js';
 import { load_error_page, load_template } from '../config/index.js';
-import { write_if_changed } from './utils.js';
+import { check_spelling, write_if_changed } from './utils.js';
 import { escape_html } from '../../utils/escape.js';
 
 /**
@@ -54,6 +53,7 @@ export const options = {
 			)},
 		error
 	},
+	version: ${s(config.kit.version.name)},
 	version_hash: ${s(hash(config.kit.version.name))}
 };
 
@@ -83,10 +83,6 @@ export async function get_hooks() {
 export { set_assets, set_building, set_fix_stack_trace, set_manifest, set_prerendering, set_read_implementation };
 `;
 
-// TODO need to re-run this whenever src/app.html or src/error.html are
-// created or changed, or src/service-worker.js is created or deleted.
-// Also, need to check that updating hooks.server.js works
-
 /**
  * Write server configuration to disk
  * @param {import('types').ValidatedConfig} config
@@ -97,15 +93,14 @@ export function write_server(config, output, root) {
 	const server_hooks_file = resolve_entry(config.kit.files.hooks.server);
 	const universal_hooks_file = resolve_entry(config.kit.files.hooks.universal);
 
-	const typo = resolve_entry('src/+hooks.server');
-	if (typo) {
-		console.log(
-			styleText(
-				['bold', 'yellow'],
-				`Unexpected + prefix. Did you mean ${typo.split('/').at(-1)?.slice(1)}?` +
-					` at ${path.resolve(typo)}`
-			)
-		);
+	if (!server_hooks_file) {
+		check_spelling('src/hooks.server', 'src/+hooks.server', 'Unexpected + prefix');
+		check_spelling('src/hooks.server', 'src/hook.server', 'Missing s suffix');
+	}
+
+	if (!universal_hooks_file) {
+		check_spelling('src/hooks', 'src/+hooks', 'Unexpected + prefix');
+		check_spelling('src/hooks', 'src/hook', 'Missing s suffix');
 	}
 
 	/** @param {string} file */