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

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 */

package/src/core/sync/write_tsconfig/index.js

@@ -0,0 +1,257 @@
+/** @import { ValidatedKitConfig } from 'types' */
+import process from 'node:process';
+import fs from 'node:fs';
+import path from 'node:path';
+import { styleText } from 'node:util';
+import { write_if_changed } from '../utils.js';
+import {
+	ESSENTIAL_OPTIONS,
+	extends_id,
+	get_subpath_imports,
+	normalize_config,
+	RECOMMENDED_OPTIONS,
+	remove_trailing_slashstar,
+	validate_resolved_config
+} from './utils.js';
+
+/** @type {import('typescript')} */
+let ts;
+try {
+	ts = await import('typescript');
+} catch {
+	// The user has not installed TypeScript.
+}
+
+/**
+ * Generates the tsconfig that the user's tsconfig inherits from.
+ * @param {import('types').ValidatedKitConfig} kit
+ * @param {string} root
+ */
+export function write_tsconfig(kit, root) {
+	const paths = get_paths(kit, root);
+
+	write_parent_tsconfig(
+		root,
+		root,
+		'$app/tsconfig',
+		{
+			compilerOptions: {
+				paths,
+				rootDirs: ['.', `${kit.outDir}/types`],
+				types: ['$app/types'],
+
+				// This is required for svelte-package to work as expected
+				// Can be overwritten
+				lib: ['ESNext', 'DOM', 'DOM.Iterable'],
+
+				...ESSENTIAL_OPTIONS,
+				...RECOMMENDED_OPTIONS
+			},
+			exclude: [kit.files.serviceWorker]
+		},
+		{
+			extends: '$app/tsconfig',
+			include: ['src']
+		},
+		kit.typescript.config
+	);
+
+	write_parent_tsconfig(
+		root,
+		kit.files.serviceWorker,
+		'$app/tsconfig/service-worker',
+		{
+			compilerOptions: {
+				paths,
+				types: ['$app/types'],
+				lib: ['ESNext', 'WebWorker'],
+				...ESSENTIAL_OPTIONS
+			}
+		},
+		{
+			extends: '$app/tsconfig/service-worker'
+		}
+	);
+}
+
+/**
+ * Write a generated `tsconfig.json` inside `node_modules`, for the
+ * user config to extend
+ * @param {string} root The project root
+ * @param {string} dir The directory to resolve a user config from
+ * @param {string} id The id of the generated config
+ * @param {any} config The contents of the generated tsconfig, with paths relative to `root`
+ * @param {any} example What to print if the user config does _not_ extend the generated config
+ * @param {ValidatedKitConfig['typescript']['config']} [transform] TODO get rid of this
+ */
+function write_parent_tsconfig(root, dir, id, config, example, transform) {
+	const out_file = path.join(root, `node_modules/${id}/tsconfig.json`);
+
+	let normalized = normalize_config(out_file, config);
+	normalized = transform?.(normalized) ?? normalized;
+
+	write_if_changed(out_file, JSON.stringify(normalized, null, '\t'));
+
+	if (!ts) {
+		// The user has not installed TypeScript. Skip validation of config.
+		return;
+	}
+
+	const user_config = load_user_tsconfig(dir);
+
+	if (user_config && modified_since_last_check(user_config.file)) {
+		// now that we've written the parent config, we can resolve the
+		// user config and validate that nothing important was overwritten
+		if (!extends_id(user_config.options, id)) {
+			console.warn(
+				styleText(
+					['bold', 'yellow'],
+					`${path.relative(process.cwd(), user_config.file)} should extend SvelteKit's built-in configuration:`
+				)
+			);
+
+			console.warn(JSON.stringify(example, null, '  '));
+
+			return;
+		}
+
+		const resolved = ts.parseJsonConfigFileContent(user_config.options, ts.sys, dir).options;
+		const warnings = validate_resolved_config(resolved, config.compilerOptions);
+
+		if (warnings.length > 0) {
+			console.warn(
+				styleText(
+					['bold', 'yellow'],
+					`Found issues while validating ${path.relative(process.cwd(), user_config.file)}`
+				)
+			);
+
+			for (const warning of warnings) {
+				console.warn(`  - ${warning}`);
+			}
+		}
+	}
+}
+
+/** @type {Map<string, number>} */
+const mtimes = new Map();
+
+/**
+ * Returns true if the file was modified since we last got here,
+ * otherwise we can skip warnings
+ * @param {string} file
+ */
+function modified_since_last_check(file) {
+	const a = mtimes.get(file) ?? -1;
+	const b = fs.statSync(file).mtimeMs;
+	mtimes.set(file, b);
+
+	return b > a;
+}
+
+/**
+ * @param {string} cwd
+ * @param {string} file
+ */
+function maybe_file(cwd, file) {
+	const resolved = path.resolve(cwd, file);
+	if (fs.existsSync(resolved)) {
+		return resolved;
+	}
+}
+
+/** @param {string} cwd */
+function load_user_tsconfig(cwd) {
+	const file = maybe_file(cwd, 'tsconfig.json') || maybe_file(cwd, 'jsconfig.json');
+	if (!file) return;
+
+	const options = load_tsconfig(file);
+
+	return {
+		file,
+		kind: path.basename(file),
+		options
+	};
+}
+
+/**
+ * @param {string} file
+ */
+function load_tsconfig(file) {
+	const options = ts.readConfigFile(file, ts.sys.readFile);
+
+	if (options.error) {
+		let message = `Failed to parse TypeScript config`;
+
+		if (typeof options.error.messageText === 'string') {
+			message += `: ${options.error.messageText}`;
+		}
+
+		const error = new Error(message);
+		error.stack = '';
+
+		if (options.error.file && options.error.start !== undefined) {
+			const line_start = options.error.file.text.lastIndexOf('\n', options.error.start);
+
+			const line =
+				line_start === -1
+					? 0
+					: options.error.file.text.slice(0, options.error.start).split('\n').length;
+			const column = options.error.start - line_start;
+
+			error.stack = `${error.message}\n    at ${path.relative(process.cwd(), file)}:${line}:${column}`;
+		}
+
+		throw error;
+	}
+
+	return options.config;
+}
+
+/** Matches anything (except the empty string/string with newline), and separates any trailing `/*` */
+const alias_key = /^(.+?)(\/\*)?$/;
+
+/** Matches anything (except the empty string/string with newline), and separates any trailing `/*` or file extension */
+const alias_value = /^(.+?)((\/\*)|(\.\w+))?$/;
+
+/**
+ * Generates tsconfig path aliases from kit's aliases and the package.json `imports` field.
+ * Related to vite alias creation.
+ *
+ * @param {import('types').ValidatedKitConfig} config
+ * @param {string} root
+ * @returns {Record<string, string[]>}
+ */
+function get_paths(config, root) {
+	const alias = {
+		...config.alias,
+		...get_subpath_imports(root)
+	};
+
+	/** @type {Record<string, string[]>} */
+	const paths = {};
+
+	for (const [key, value] of Object.entries(alias)) {
+		const key_match = alias_key.exec(key);
+		if (!key_match) throw new Error(`Invalid alias key: ${key}`);
+
+		const value_match = alias_value.exec(value);
+		if (!value_match) throw new Error(`Invalid alias value: ${value}`);
+
+		const resolved = path.resolve(root, remove_trailing_slashstar(value));
+		const slashstar = key_match[2];
+
+		if (slashstar) {
+			paths[key] = [resolved + '/*'];
+		} else {
+			paths[key] = [resolved];
+			const fileending = value_match[4];
+
+			if (!fileending && !(key + '/*' in alias)) {
+				paths[key + '/*'] = [resolved + '/*'];
+			}
+		}
+	}
+
+	return paths;
+}

package/src/core/sync/write_tsconfig/utils.js

@@ -0,0 +1,162 @@
+import path from 'node:path';
+import { normalize_import_value, read_package_imports } from '../../../utils/imports.js';
+import { posixify } from '../../../utils/os.js';
+
+/**
+ * Without these, compilation will fail
+ * @type {Record<string, any>}
+ */
+export const ESSENTIAL_OPTIONS = {
+	// svelte-preprocess cannot figure out whether you have a value or a type, so tell TypeScript
+	// to enforce using \`import type\` instead of \`import\` for Types.
+	// Also, TypeScript doesn't know about import usages in the template because it only sees the
+	// script of a Svelte file. Therefore preserve all value imports.
+	verbatimModuleSyntax: true,
+	// Vite compiles modules one at a time
+	isolatedModules: true
+};
+
+/**
+ * Options that are strongly recommended, either because not having them is silly or
+ * because the align TypeScript's behaviour with Vite's, but which can be overwritten
+ * @type {Record<string, any>}
+ */
+export const RECOMMENDED_OPTIONS = {
+	allowJs: true,
+	checkJs: true,
+	forceConsistentCasingInFileNames: true,
+	resolveJsonModule: true,
+	moduleDetection: 'force',
+	moduleResolution: 'bundler',
+	allowImportingTsExtensions: true,
+	module: 'esnext',
+	target: 'esnext',
+	skipLibCheck: true,
+	esModuleInterop: true,
+	noEmit: true // prevent tsconfig error "overwriting input files" - Vite handles the build and ignores this
+};
+
+/**
+ * Validates that a tsconfig contains `"extends": "<id>"`
+ * @param {any} options
+ * @param {string} id
+ */
+export function extends_id(options, id) {
+	const o = options.extends;
+	return Array.isArray(o) ? o.includes(id) : o === id;
+}
+
+/**
+ * Makes paths relative to the output file
+ * @param {string} out
+ * @param {any} config
+ * @param {(input: any) => any} [transform] TODO get rid of this option
+ */
+export function normalize_config(out, config, transform) {
+	const dir = path.dirname(out);
+	const relative = (/** @type {string} */ file) => posixify(path.relative(dir, file));
+
+	const paths =
+		config.compilerOptions?.paths &&
+		Object.fromEntries(
+			Object.entries(config.compilerOptions?.paths).map(([k, v]) => [k, v.map(relative)])
+		);
+
+	const normalized = {
+		...config,
+		compilerOptions: {
+			...config.compilerOptions,
+			paths,
+			rootDirs: config.compilerOptions?.rootDirs?.map(relative)
+		},
+		include: config.include?.map(relative),
+		exclude: config.exclude?.map(relative)
+	};
+
+	return transform?.(normalized) ?? normalized;
+}
+
+/**
+ * @param {any} resolved
+ * @param {any} options
+ */
+export function validate_resolved_config(resolved, options) {
+	const warnings = [];
+
+	const join = (/** @type {string[]} */ array) =>
+		array
+			.map((v) => JSON.stringify(v))
+			.join(', ')
+			.replace(/, ([^,]*)$/, ' and $1');
+
+	const missing_types = options.types?.filter(
+		(/** @type {string} */ type) => !resolved.types?.includes(type)
+	);
+
+	if (missing_types.length > 0) {
+		warnings.push(`"types" was overwritten. It must include ${join(missing_types)}`);
+	}
+
+	if (options.paths) {
+		/** @type {Set<string>} */
+		const mismatch = new Set();
+
+		for (const [k, expected] of Object.entries(options.paths)) {
+			const actual = resolved.paths?.[k]?.map((/** @type {string} */ x) =>
+				path.resolve(/** @type {string} */ (resolved.pathsBasePath), x)
+			);
+
+			if (JSON.stringify(expected) !== JSON.stringify(actual)) {
+				mismatch.add(remove_trailing_slashstar(k));
+			}
+		}
+
+		if (mismatch.size > 0) {
+			const joined = join([...mismatch]);
+
+			warnings.push(`"paths" was overwritten. Imports from ${joined} may not typecheck`);
+		}
+	}
+
+	for (const key in ESSENTIAL_OPTIONS) {
+		if (resolved[key] !== options[key]) {
+			warnings.push(`"${key}" was overwritten. It should be ${JSON.stringify(options[key])}`);
+		}
+	}
+
+	return warnings;
+}
+
+/**
+ * @param {string} file
+ */
+export function remove_trailing_slashstar(file) {
+	if (file.endsWith('/*')) {
+		return file.slice(0, -2);
+	} else {
+		return file;
+	}
+}
+
+/**
+ * @param {string} root
+ */
+export function get_subpath_imports(root) {
+	// Add all `#`-prefixed imports from package.json as path aliases
+	const imports = read_package_imports(root);
+
+	/** @type {Record<string, string>} */
+	const alias = {};
+
+	if (imports) {
+		for (const [key, raw_value] of Object.entries(imports)) {
+			if (!key.startsWith('#')) continue;
+			const value = normalize_import_value(raw_value);
+			if (value) {
+				alias[key] = value;
+			}
+		}
+	}
+
+	return alias;
+}

package/src/core/sync/write_types/index.js

@@ -609,7 +609,7 @@ function generate_params_type(params, outdir, config) {
 			(param) =>
 				`${/^\w+$/.test(param.name) ? param.name : `'${param.name}'`}${param.optional ? '?' : ''}: ${
 					param.matcher
-						? `import('@sveltejs/kit').MatcherParam<(typeof import('${params_import}').params)[${JSON.stringify(param.matcher)}]>`
+						? `Kit.MatcherParam<(typeof import('${params_import}').params)[${JSON.stringify(param.matcher)}]>`
 						: 'string'
 				}${param.optional ? ' | undefined' : ''}`
 		)
@@ -717,6 +717,62 @@ export function tweak_types(content, is_server) {
 			return _modified;
 		}
 
+		/**
+		 * @param {number} name_end position of the identifier the annotation is attached to
+		 * @param {import('typescript').TypeNode} type_node
+		 * @returns {string} the removed annotation's text
+		 */
+		function strip_type_annotation(name_end, type_node) {
+			let a = type_node.pos;
+			const b = type_node.end;
+			while (is_whitespace(content[a])) a += 1;
+
+			const type = content.slice(a, b);
+			code.remove(name_end, type_node.end);
+			modified = true;
+			return type;
+		}
+
+		/**
+		 * Types the first parameter of an untyped arrow/function expression.
+		 * @param {import('typescript').Expression | undefined} rhs
+		 * @param {string} type
+		 * @returns {boolean} `false` if there was nothing to annotate
+		 */
+		function annotate_first_param(rhs, type) {
+			if (
+				!rhs ||
+				!(ts.isArrowFunction(rhs) || ts.isFunctionExpression(rhs)) ||
+				!rhs.parameters.length
+			) {
+				return false;
+			}
+
+			const arg = rhs.parameters[0];
+			const add_parens = content[arg.pos - 1] !== '(';
+
+			if (add_parens) code.prependRight(arg.pos, '(');
+
+			if (arg.type) return false;
+
+			code.appendLeft(arg.name.end, `: ${type}` + (add_parens ? ')' : ''));
+			return true;
+		}
+
+		/**
+		 * @param {import('typescript').Expression | undefined} initializer
+		 * @param {(prop: import('typescript').PropertyAssignment) => void} callback
+		 */
+		function for_each_action(initializer, callback) {
+			if (initializer && ts.isObjectLiteralExpression(initializer)) {
+				for (const prop of initializer.properties) {
+					if (ts.isPropertyAssignment(prop) && ts.isIdentifier(prop.name)) {
+						callback(prop);
+					}
+				}
+			}
+		}
+
 		ast.forEachChild((node) => {
 			if (ts.isFunctionDeclaration(node) && node.name?.text && node.name?.text === 'load') {
 				// remove JSDoc comment above `export function load ...`
@@ -742,42 +798,13 @@ export function tweak_types(content, is_server) {
 						// edge case — remove JSDoc comment above individual export
 						replace_jsdoc_type_tags(declaration, declaration.initializer);
 
-						// remove type from `export const load: Load ...`
 						if (declaration.type) {
-							let a = declaration.type.pos;
-							const b = declaration.type.end;
-							while (is_whitespace(content[a])) a += 1;
-
-							const type = content.slice(a, b);
-							code.remove(declaration.name.end, declaration.type.end);
+							const type = strip_type_annotation(declaration.name.end, declaration.type);
 
-							const rhs = declaration.initializer;
-
-							if (
-								rhs &&
-								(ts.isArrowFunction(rhs) || ts.isFunctionExpression(rhs)) &&
-								rhs.parameters.length
-							) {
-								const arg = rhs.parameters[0];
-								const add_parens = content[arg.pos - 1] !== '(';
-
-								if (add_parens) code.prependRight(arg.pos, '(');
-
-								if (arg && !arg.type) {
-									code.appendLeft(
-										arg.name.end,
-										`: Parameters<${type}>[0]` + (add_parens ? ')' : '')
-									);
-								} else {
-									// prevent "type X is imported but not used" (isn't silenced by @ts-nocheck) when svelte-check runs
-									code.append(`;null as any as ${type};`);
-								}
-							} else {
+							if (!annotate_first_param(declaration.initializer, `Parameters<${type}>[0]`)) {
 								// prevent "type X is imported but not used" (isn't silenced by @ts-nocheck) when svelte-check runs
 								code.append(`;null as any as ${type};`);
 							}
-
-							modified = true;
 						}
 					} else if (
 						is_server &&
@@ -789,69 +816,34 @@ export function tweak_types(content, is_server) {
 						const removed = replace_jsdoc_type_tags(node, declaration.initializer);
 						// ... and move type to each individual action
 						if (removed) {
-							const rhs = declaration.initializer;
-							if (ts.isObjectLiteralExpression(rhs)) {
-								for (const prop of rhs.properties) {
-									if (ts.isPropertyAssignment(prop) && ts.isIdentifier(prop.name)) {
-										const rhs = prop.initializer;
-										const replaced = replace_jsdoc_type_tags(prop, rhs);
-										if (
-											!replaced &&
-											rhs &&
-											(ts.isArrowFunction(rhs) || ts.isFunctionExpression(rhs)) &&
-											rhs.parameters?.[0]
-										) {
-											const name = ts.isIdentifier(rhs.parameters[0].name)
-												? rhs.parameters[0].name.text
-												: 'event';
-											code.prependRight(
-												rhs.pos,
-												`/** @param {import('./$types').RequestEvent} ${name} */ `
-											);
-										}
-									}
+							for_each_action(declaration.initializer, (prop) => {
+								const rhs = prop.initializer;
+								const replaced = replace_jsdoc_type_tags(prop, rhs);
+								if (
+									!replaced &&
+									rhs &&
+									(ts.isArrowFunction(rhs) || ts.isFunctionExpression(rhs)) &&
+									rhs.parameters?.[0]
+								) {
+									const name = ts.isIdentifier(rhs.parameters[0].name)
+										? rhs.parameters[0].name.text
+										: 'event';
+									code.prependRight(
+										rhs.pos,
+										`/** @param {import('./$types').RequestEvent} ${name} */ `
+									);
 								}
-							}
+							});
 						}
 
-						// remove type from `export const actions: Actions ...`
 						if (declaration.type) {
-							let a = declaration.type.pos;
-							const b = declaration.type.end;
-							while (is_whitespace(content[a])) a += 1;
-
-							const type = content.slice(a, b);
-							code.remove(declaration.name.end, declaration.type.end);
+							const type = strip_type_annotation(declaration.name.end, declaration.type);
 							code.append(`;null as any as ${type};`);
-							modified = true;
 
 							// ... and move type to each individual action
-							const rhs = declaration.initializer;
-							if (ts.isObjectLiteralExpression(rhs)) {
-								for (const prop of rhs.properties) {
-									if (ts.isPropertyAssignment(prop) && ts.isIdentifier(prop.name)) {
-										const rhs = prop.initializer;
-
-										if (
-											rhs &&
-											(ts.isArrowFunction(rhs) || ts.isFunctionExpression(rhs)) &&
-											rhs.parameters.length
-										) {
-											const arg = rhs.parameters[0];
-											const add_parens = content[arg.pos - 1] !== '(';
-
-											if (add_parens) code.prependRight(arg.pos, '(');
-
-											if (arg && !arg.type) {
-												code.appendLeft(
-													arg.name.end,
-													": import('./$types').RequestEvent" + (add_parens ? ')' : '')
-												);
-											}
-										}
-									}
-								}
-							}
+							for_each_action(declaration.initializer, (prop) => {
+								annotate_first_param(prop.initializer, "import('./$types').RequestEvent");
+							});
 						}
 					}
 				}