@staticbolt/core 1.0.0-beta.29 → 1.0.0-beta.30

package/lib/plugins/index.mjs

@@ -1,8 +1,9 @@
 import { A as isTextAssetMetadata, C as isBinaryAssetMetadata, D as isScriptMetadata, E as isPackageMetadata, F as readJsonFile, H as splitHtmlLink, L as safeReadFileSync, M as isScriptType, N as METADATA_TYPES, O as isStyleMetadata, P as Resolver, S as filterStyleMetadata, T as isMarkdownMetadata, U as DependencyTracker, V as isValidRelativePath, _ as mergeMaps, b as printFmtError, c as downloadContent, d as hashContent, f as humanReadableBytes, h as isURL, j as isWebManifestMetadata, k as isSvgMetadata, l as escapeHtml, n as bytesToKB, s as cloneObject, w as isHtmlMetadata, x as filterScriptMetadata, y as PrintFormattedError, z as valueOrError } from "../utilities-D0KXIZ-B.mjs";
-import { _ as replaceExtension, a as basename, c as isAbsolute, d as join, f as normalize, g as relative, i as createLog, l as isPathMatch, m as parsePatterns, n as CUSTOM_ATTRIBUTES, o as dirname, p as parse$2, r as Log, s as extname, t as CONFIG_FILE_NAME, u as isSubpath, v as resolve } from "../common-DUFKS3lW.mjs";
+import { _ as replaceExtension, a as basename, c as isAbsolute, d as join, f as normalize, g as relative, i as createLog, l as isPathMatch, m as parsePatterns, n as CUSTOM_ATTRIBUTES, o as dirname, p as parse$2, r as Log, s as extname, u as isSubpath, v as resolve } from "../common-DUFKS3lW.mjs";
 import { _ as minifyHtml, a as formatStyle, c as minifyStylePass, d as minifyScript, f as minifyScriptPass, g as formatHtmlPass, h as formatHtml, i as minifySvgPass, l as formatScript, m as formatMarkdownPass, n as formatSvgPass, o as formatStylePass, p as formatMarkdown, r as minifySvg, s as minifyStyle, t as formatSvg, u as formatScriptPass, v as minifyHtmlPass, y as formatCode } from "../deferred-DTj91vEg.mjs";
+import { t as loadConfigFile } from "../load-config-D-FtbUws.mjs";
 import { createRequire } from "node:module";
-import { copyFileSync, cpSync, existsSync, mkdirSync, readFileSync, readdirSync, rmSync, rmdirSync, unlinkSync, writeFileSync } from "node:fs";
+import { copyFileSync, cpSync, existsSync, mkdirSync, readFileSync, readdirSync, rmSync, rmdirSync, statSync, unlinkSync, writeFileSync } from "node:fs";
 import nodePath from "node:path";
 import chalk from "chalk";
 import json5 from "json5";
@@ -22,6 +23,7 @@ import transformDefine from "babel-plugin-transform-define";
 import { availableParallelism } from "node:os";
 import { Worker } from "node:worker_threads";
 import vm from "node:vm";
+import transformModulesCommonjs from "@babel/plugin-transform-modules-commonjs";
 import * as z$1 from "zod/v4";
 import rehypeExternalLinks from "rehype-external-links";
 import rehypeSlug from "rehype-slug";
@@ -3284,15 +3286,23 @@ function resolveWorkerUrl() {
 
 //#endregion
 //#region src/helpers/execute-js-in-vm.ts
+/** Runs an ES module graph inside a `node:vm` context and hands back what the entry module exported. */
 async function executeJsInVmUnsafe(options) {
-	const { root, entryFile, context: contextObject = {}, html } = options;
+	const { dom, context } = await createSandbox(options.html, options.context);
+	return {
+		exports: { ...await new ModuleRunner(context, options).import(options.entryFile) },
+		dom
+	};
+}
+/** A jsdom window when there is html to work on, a bare object with the essentials otherwise. */
+async function createSandbox(html, globals = {}) {
 	let dom;
 	if (html) {
 		const { JSDOM, VirtualConsole } = await import("jsdom");
-		dom = html ? new JSDOM(html, {
+		dom = new JSDOM(html, {
 			virtualConsole: new VirtualConsole(),
 			url: "http://localhost/"
-		}) : void 0;
+		});
 	}
 	const window = dom ? dom.window : {};
 	if (!dom) Object.assign(window, {
@@ -3303,96 +3313,150 @@ async function executeJsInVmUnsafe(options) {
 		fetch,
 		URL
 	});
-	Object.assign(window, Object.assign({
-		___output: {},
-		console
-	}, contextObject));
-	const context = vm.createContext(window);
-	/** - Save modules in memory to avoid creating a new one for the same file */
-	const modules = {};
-	options.onModuleLoad?.(entryFile);
-	const script = await options.getCode(entryFile);
-	if (!script) {
-		Log.error(`[executeJsInVM] can't find the script '${entryFile}'`);
-		return {
-			output: context.___output,
-			exports: {},
-			dom
-		};
+	Object.assign(window, { console }, globals);
+	return {
+		dom,
+		context: vm.createContext(window)
+	};
+}
+const BASE_META_URL = "http://localhost:3000";
+/**
+* Runs modules the way ES modules run: each one once, its static imports before it in source order, top-level `await` included. A
+* module that imports one of its own importers (a cycle) gets its exports as far as they are.
+*
+* Modules are rewritten to CommonJS and run as functions in the context, which keeps them collectable once the run is over.
+*/
+var ModuleRunner = class {
+	/** Resolves to the module's exports once it has run. Registered before the module starts, so it only ever runs once. */
+	#runs = /* @__PURE__ */ new Map();
+	/** The exports of every module that has started, which is what a cycle gets to see. */
+	#exports = /* @__PURE__ */ new Map();
+	#context;
+	#options;
+	constructor(context, options) {
+		this.#context = context;
+		this.#options = options;
 	}
-	const module = new vm.SourceTextModule(script, {
-		context,
-		identifier: entryFile,
-		importModuleDynamically,
-		initializeImportMeta
-	});
-	modules[entryFile] = module;
-	const baseMetaUrl = "http://localhost:3000";
-	function initializeImportMeta(meta, referencingModule) {
-		let id = referencingModule.identifier;
-		if (extname(id) === ".html") id = dirname(id) + "/";
-		meta.resolve = (url) => {
-			return new URL(join(id, url), baseMetaUrl).href;
-		};
-		meta.url = new URL(id, baseMetaUrl).href;
-	}
-	async function importModuleDynamically(specifier, referrer) {
-		const m = await linker(specifier, referrer);
-		if (m.status === "unlinked") await m.link(linker);
-		else if (m.status === "linked") await m.evaluate();
-		return m;
-	}
-	async function linker(specifier, referencingModule) {
-		const isNativeModule = specifier.startsWith("node:");
-		const resolveName = isNativeModule ? specifier : join(dirname(referencingModule.identifier), specifier);
-		if (!isNativeModule) options.onModuleLoad?.(resolveName);
-		if (extname(resolveName) === ".json") {
-			const jsonPath = join(root, resolveName);
-			if (!existsSync(jsonPath)) throw new Error(`[executeJsInVM] can't find the file '${resolveName}'`);
-			let jsonString = readFileSync(jsonPath, "utf8");
-			jsonString = "const __json = " + jsonString + ";export default __json;";
-			const module = new vm.SourceTextModule(jsonString, {
-				context,
-				identifier: resolveName
-			});
-			modules[resolveName] = module;
-			return module;
-		}
-		if (Object.hasOwn(modules, resolveName)) return modules[resolveName];
-		if (isNativeModule) {
-			const builtIn = await import(specifier);
-			const exportNames = Object.keys(builtIn);
-			const module = new vm.SyntheticModule(exportNames, function() {
-				for (const key of exportNames) this.setExport(key, builtIn[key]);
-			}, {
-				context,
-				identifier: resolveName
-			});
-			modules[resolveName] = module;
-			return module;
-		}
-		const moduleScript = await options.getCode(resolveName);
-		if (!moduleScript) {
-			Log.error(`[executeJsInVM] can't find the script '${resolveName}' in the transformed scripts map`);
-			throw new Error(`can't resolve module '${specifier}' from '${referencingModule.identifier}'`);
-		}
-		const module = new vm.SourceTextModule(moduleScript, {
-			context: referencingModule.context,
-			identifier: resolveName,
-			importModuleDynamically,
-			initializeImportMeta
+	/**
+	* Runs the module unless it already has, and resolves to its exports. `importers` is the chain of static imports that led here,
+	* empty for the entry and for dynamic imports.
+	*/
+	import(id, importers = /* @__PURE__ */ new Set()) {
+		let run = this.#runs.get(id);
+		if (!run) {
+			run = this.#run(id, importers);
+			this.#runs.set(id, run);
+		}
+		return run;
+	}
+	async #run(id, importers) {
+		const exports = {};
+		this.#exports.set(id, exports);
+		if (id.startsWith("node:")) return Object.assign(exports, await import(id));
+		this.#options.onModuleLoad?.(id);
+		if (extname(id) === ".json") {
+			exports.default = this.#readJson(id);
+			return exports;
+		}
+		const source = await this.#options.getCode(id);
+		if (!source) throw new Error(`[executeJsInVM] can't find the script '${id}'`);
+		const { code, imports } = await toModuleBody(source, id);
+		const chain = new Set(importers).add(id);
+		for (const specifier of imports) {
+			const importId = this.#resolve(specifier, id);
+			if (!chain.has(importId)) await this.import(importId, chain);
+		}
+		await this.#compile(code, id)({
+			require: (specifier) => this.#require(specifier, id),
+			__import: (specifier) => this.import(this.#resolve(specifier, id)),
+			__meta: createImportMeta(id),
+			exports
 		});
-		modules[resolveName] = module;
-		return module;
+		return exports;
+	}
+	/** Creates the function in the context, so its globals are the sandbox's. */
+	#compile(code, id) {
+		return new vm.Script(`"use strict"; (async function ({ require, __import, __meta, exports }) {\n${code}\n})`, {
+			filename: id,
+			lineOffset: -1
+		}).runInContext(this.#context);
+	}
+	#require(specifier, importer) {
+		const exports = this.#exports.get(this.#resolve(specifier, importer));
+		if (!exports) throw new Error(`[executeJsInVM] '${specifier}' has not run before '${importer}'`);
+		return exports;
 	}
-	await module.link(linker);
-	await module.evaluate();
-	const exports = Object.fromEntries(Object.entries(module.namespace));
+	#resolve(specifier, importer) {
+		return specifier.startsWith("node:") ? specifier : join(dirname(importer), specifier);
+	}
+	#readJson(id) {
+		const jsonPath = join(this.#options.root, id);
+		if (!existsSync(jsonPath)) throw new Error(`[executeJsInVM] can't find the file '${id}'`);
+		return JSON.parse(readFileSync(jsonPath, "utf8"));
+	}
+};
+function createImportMeta(id) {
+	if (extname(id) === ".html") id = dirname(id) + "/";
+	const url = new URL(id, BASE_META_URL).href;
 	return {
-		output: context.___output,
-		exports,
-		dom
+		url,
+		resolve: (specifier) => new URL(specifier, url).href
+	};
+}
+/**
+* The same module runs once per page that uses it, so its rewrite is kept by source. The oldest entries go once there are more
+* than `MODULE_BODY_CACHE_SIZE`, which keeps a long editing session from piling up dead ones.
+*/
+const moduleBodyCache = /* @__PURE__ */ new Map();
+const MODULE_BODY_CACHE_SIZE = 256;
+/**
+* Rewrites an ES module into the body of a `ModuleBody`: imports and exports become `require` and `exports`, `import.meta`
+* becomes `__meta` and `import()` becomes `__import()`. Also lists what the module imports statically.
+*/
+async function toModuleBody(source, id) {
+	const cached = moduleBodyCache.get(source);
+	if (cached) return cached;
+	const imports = [];
+	const result = await babel.transformAsync(source, {
+		filename: id,
+		sourceType: "module",
+		babelrc: false,
+		configFile: false,
+		compact: false,
+		sourceMaps: false,
+		plugins: [collectImportsAndRewriteMeta(imports), [transformModulesCommonjs, {
+			importInterop: "none",
+			strictMode: false
+		}]]
+	});
+	if (!result?.code) throw new Error(`[executeJsInVM] failed to transform '${id}'`);
+	const moduleBody = {
+		code: result.code,
+		imports
 	};
+	moduleBodyCache.set(source, moduleBody);
+	if (moduleBodyCache.size > MODULE_BODY_CACHE_SIZE) moduleBodyCache.delete(moduleBodyCache.keys().next().value);
+	return moduleBody;
+}
+/** Lists the static import sources into `imports`, and turns `import.meta` into `__meta` and `import()` into `__import()`. */
+function collectImportsAndRewriteMeta(imports) {
+	return { visitor: {
+		ImportDeclaration(path) {
+			imports.push(path.node.source.value);
+		},
+		ExportNamedDeclaration(path) {
+			if (path.node.source) imports.push(path.node.source.value);
+		},
+		ExportAllDeclaration(path) {
+			imports.push(path.node.source.value);
+		},
+		MetaProperty(path) {
+			if (path.node.meta.name === "import") path.replaceWith(t.identifier("__meta"));
+		},
+		CallExpression(path) {
+			if (t.isImport(path.node.callee)) path.node.callee = t.identifier("__import");
+		}
+	} };
 }
 const executeJsInVM = valueOrError(executeJsInVmUnsafe);
 
@@ -3413,7 +3477,6 @@ const executeJsInVM = valueOrError(executeJsInVmUnsafe);
 *
 * Notes:
 *
-* - Requires Node started with "--experimental-vm-modules". Without it the tags are removed without running and an error is logged.
 * - "full-dom" needs a fully constructed page (a head and a body), so place this plugin last when using it.
 * - Failures are per tag: the error is logged and the rest of the page carries on.
 * - In development the files each page executed are tracked, so editing one of them recompiles the pages that used it.
@@ -3426,23 +3489,13 @@ function htmlBuildTimeScript(options = {}) {
 	const printFmtError = PrintFormattedError.create({ function: htmlBuildTimeScript });
 	/** Page → the files its build-time scripts executed. Used to recompile the page when one of them changes. */
 	const dependencies = new DependencyTracker();
-	let isVmEnabled = true;
 	return {
 		name: "html-build-time-script",
-		setup() {
-			if (vm.SourceTextModule) return;
-			isVmEnabled = false;
-			printFmtError("Script execution requires the `node:vm` module, which is currently unavailable.", "\nStart Node.js with the `--experimental-vm-modules` flag to enable it.");
-		},
 		async postTransform() {
 			const isTracking = !this.production;
 			const executedSources = /* @__PURE__ */ new Map();
 			for (const metadata of this.metadataList) {
 				if (!isHtmlMetadata(metadata)) continue;
-				if (!isVmEnabled) {
-					for (const node of metadata.ast.querySelectorAll(query)) node.remove();
-					continue;
-				}
 				const isReady = metadata.ast.querySelector("body") && metadata.ast.querySelector("head");
 				const scripts = metadata.ast.querySelectorAll(query);
 				if (scripts.length === 0) continue;
@@ -5818,7 +5871,6 @@ function htmlMergeStylesPlugin() {
 * - A resolved link keeps the style it was written in: an extensionless or directory-style link to a page stays that way, while a
 *   script path resolving to ".ts", ".tsx" or ".jsx" is rewritten to ".js", which is what actually ships.
 * - Query strings and hashes survive both resolving and rebasing, and a link that ends up pointing at its own page becomes "./".
-* - The config file is watched, but changing it only warns: it takes a restart.
 */
 function coreBasePlugin() {
 	const JS_EXTENSIONS = /* @__PURE__ */ new Set([
@@ -5833,16 +5885,12 @@ function coreBasePlugin() {
 	]);
 	return {
 		name: "core-base",
-		setup() {
-			this.watcher?.add(CONFIG_FILE_NAME);
-		},
 		read(absolutePath) {
 			const [fileContent, readFileError] = safeReadFileSync(absolutePath, "utf8");
 			if (readFileError) return;
 			return fileContent;
 		},
 		onFileEvent(event, filePath) {
-			if (basename(filePath) === ".staticbolt.ts") this.log.warn(`Config file "${CONFIG_FILE_NAME}" has changed. Please restart the server.`);
 			if (event === "unlink") this.resolver.files.delete(filePath);
 		},
 		clone(metadata) {
@@ -7691,6 +7739,8 @@ function orderByDependencyDepth(allMetadata, entryPoints, filePaths) {
 * - On a change, the affected pages are recompiled in dependency order and metadata nothing references any more is dropped. If only
 *   CSS changed the stylesheets are swapped in place, otherwise the page reloads.
 * - Compiled pages are trimmed to the number of connected clients, dropping the least recently served ones.
+* - Closing the app drops the connected clients and stops the server, which frees the port for the next one; the browser reloads
+*   itself as soon as it reconnects.
 */
 function developmentServerPlugin(options = {}) {
 	const host = options.host ?? "0.0.0.0";
@@ -7701,10 +7751,10 @@ function developmentServerPlugin(options = {}) {
 	let websocket;
 	const wsClients = /* @__PURE__ */ new Set();
 	const entryPointAgeMap = /* @__PURE__ */ new Map();
-	function upgradeWebSocketHandler(request, socket, head) {
-		websocket.handleUpgrade(request, socket, head, (ws) => {
+	function upgradeWebSocketHandler(server, request, socket, head) {
+		server.handleUpgrade(request, socket, head, (ws) => {
 			wsClients.add(ws);
-			websocket.emit("connection", ws, request);
+			server.emit("connection", ws, request);
 			ws.send(JSON.stringify({ data: "connected" }));
 			ws.on("close", () => {
 				wsClients.delete(ws);
@@ -7719,9 +7769,10 @@ function developmentServerPlugin(options = {}) {
 	}
 	return {
 		name: "dev-server",
-		setup() {
+		async setup() {
 			if (this.production) return;
-			websocket = new WebSocketServer({ noServer: true });
+			const websocketServer = new WebSocketServer({ noServer: true });
+			websocket = websocketServer;
 			const fastifyServe = async (request, reply) => {
 				const requestPath = normalize("." + decodeURIComponent(request.urlData().path || "./"));
 				await this.handleRequest(requestPath, reply, request);
@@ -7730,18 +7781,8 @@ function developmentServerPlugin(options = {}) {
 			fastify.register(fastifyUrlData);
 			fastify.register(fastifyStatic, { root: [this.root, join(this.root, publicDirectory)] });
 			fastify.addHook("onRequest", fastifyServe);
-			fastify.server.on("upgrade", upgradeWebSocketHandler);
-			fastify.listen({
-				port,
-				host
-			}, (error, address) => {
-				if (error) {
-					this.log.error(error.message);
-					throw new Error(error.message);
-				}
-				this.log.info(chalk.bold("Server listening on"), chalk.green(address + entry));
-			});
-			websocket.on("connection", () => {
+			fastify.server.on("upgrade", (request, socket, head) => upgradeWebSocketHandler(websocketServer, request, socket, head));
+			websocketServer.on("connection", () => {
 				const sortedByAge = Array.from(entryPointAgeMap).toSorted((a, b) => a[1] - b[1]).map(([id]) => id);
 				const excess = sortedByAge.length - wsClients.size;
 				if (excess > 0) for (const id of sortedByAge.slice(0, excess)) {
@@ -7749,6 +7790,17 @@ function developmentServerPlugin(options = {}) {
 					removeAndPruneOrphans(this.metadataList, id);
 				}
 			});
+			const address = await fastify.listen({
+				port,
+				host
+			});
+			this.log.info(chalk.bold("Server listening on"), chalk.green(address + entry));
+		},
+		async teardown() {
+			for (const client of wsClients) client.terminate();
+			wsClients.clear();
+			websocket?.close();
+			await fastify?.close();
 		},
 		async onFileEvent(event, changedSource) {
 			if (event === "unlink") {
@@ -7903,6 +7955,7 @@ function printExecutionTime(executionTime) {
 /** Every bound hook, in bind order. The `satisfies` makes a hook added to `Plugin` a type error until it is listed here. */
 const BOUND_HOOKS = Object.keys({
 	setup: true,
+	teardown: true,
 	read: true,
 	load: true,
 	resolveSource: true,
@@ -7947,9 +8000,10 @@ var App = class {
 	pluginData = {};
 	/** Exclude paths from being emitted. */
 	emitExclude = /* @__PURE__ */ new Set();
-	/** Chokidar watcher. */
+	/** Chokidar watcher. Development only, and gone once the app is closed. */
 	watcher;
 	isPluginInitialized = false;
+	isClosed = false;
 	measureExecutionTime = false;
 	executionTime = {};
 	/** How long the hooks called from inside the hook currently being measured took. Held in an object so plugin contexts share it. */
@@ -7991,17 +8045,19 @@ var App = class {
 			console.error(error);
 		});
 	}
+	/** Binds a copy of the plugin's hooks to this app, leaving the user's object untouched. */
 	bindPlugin(plugin, pluginIndex) {
 		const pluginContext = Object.create(this);
 		pluginContext.pluginIndex = pluginIndex;
 		pluginContext.pluginName = plugin.name;
 		pluginContext.log = createLog(`[${plugin.name}]`);
-		const hooks = plugin;
+		const boundPlugin = { ...plugin };
+		const hooks = boundPlugin;
 		for (const hookName of BOUND_HOOKS) {
 			const hook = hooks[hookName];
 			hooks[hookName] = hook ? hook.bind(pluginContext) : emptyFunction;
 		}
-		return plugin;
+		return boundPlugin;
 	}
 	callPluginMethod(plugin, method, ...arguments_) {
 		if (!this.measureExecutionTime) {
@@ -8069,6 +8125,22 @@ var App = class {
 		this.log.info("Build complete");
 		if (this.measureExecutionTime) printExecutionTime(this.executionTime);
 	}
+	/**
+	* Stops watching and lets every plugin release what its `setup` took, in reverse order. A teardown that throws is reported and
+	* the rest still run. Closing again does nothing.
+	*/
+	async close() {
+		if (this.isClosed) return;
+		this.isClosed = true;
+		await this.watcher?.close();
+		this.watcher = void 0;
+		for (const plugin of this.plugins.toReversed()) if (plugin.teardown !== emptyFunction) try {
+			await this.callPluginMethod(plugin, "teardown");
+		} catch (error) {
+			this.log.error(`[${plugin.name}] Teardown failed:`);
+			console.error(error);
+		}
+	}
 	async process(id) {
 		const metadata = await this.load(id);
 		if (!metadata) {
@@ -10119,26 +10191,128 @@ function shortenHexColor(hexColor) {
 *
 * - The command owns the run. It forces development mode onto the config and creates its own App.
 * - Serving itself belongs to developmentServerPlugin; this only starts the app in the right mode.
+* - The config file is watched. When it changes it is loaded again, the running app is closed and a new one starts from the new
+*   config. A config that fails to load leaves the running app alone; a new app that fails to start is closed, so nothing is
+*   served until the next save. Plugins have to be created inside the config file: only that file is evaluated again, so plugin
+*   objects imported from elsewhere would be the same ones the closed app used, and those are refused.
 */
 function serveCliPlugin(options = {}) {
 	const name = options.command ?? "serve";
 	const aliases = options.aliases ?? ["dev"];
 	return {
 		name: "serve-cli-plugin",
-		cli(config, configPath) {
-			const buildCommand = this.defineSubcommand({
+		cli(config, configPath, projectDirectory) {
+			const serveCommand = this.defineSubcommand({
 				name,
 				aliases,
-				meta: { description: "Dev server for static bolt." }
+				meta: { description: "Dev server for staticbolt." }
 			});
-			buildCommand.onExecute(async () => {
-				config.production = false;
-				await new App(config, configPath).run();
-			});
-			this.addCommand(buildCommand);
+			serveCommand.onExecute(() => new DevelopmentRun(config, configPath, projectDirectory).start());
+			this.addCommand(serveCommand);
 		}
 	};
 }
+/** The app running in development mode, replaced by a fresh one whenever the config file changes. */
+var DevelopmentRun = class {
+	#app;
+	#config;
+	#configPath;
+	#configName;
+	#projectDirectory;
+	/** Restarts run one at a time; a change that lands during one waits its turn. */
+	#restartQueue = Promise.resolve();
+	/** The most recent change, so a queued restart can be skipped once a newer change is waiting behind it. */
+	#latestChange = 0;
+	/** When the config file was last written, as of the last time it was loaded. */
+	#configModified;
+	constructor(config, configPath, projectDirectory) {
+		config.production = false;
+		this.#config = config;
+		this.#app = new App(config, configPath);
+		this.#configPath = configPath;
+		this.#configName = basename(configPath);
+		this.#projectDirectory = projectDirectory;
+		this.#configModified = this.#modifiedTime();
+	}
+	async start() {
+		chokidar.watch(this.#configPath, {
+			ignoreInitial: true,
+			awaitWriteFinish: {
+				stabilityThreshold: 100,
+				pollInterval: 20
+			}
+		}).on("change", () => this.#queueRestart()).on("add", () => this.#queueRestart());
+		this.#restartQueue = this.#app.run();
+		await this.#restartQueue;
+		this.#restartIfModified();
+	}
+	#queueRestart() {
+		const change = ++this.#latestChange;
+		this.#restartQueue = this.#restartQueue.then(async () => {
+			if (change === this.#latestChange) await this.#restart();
+		});
+	}
+	/**
+	* The app starting its own watcher makes the file system drop events for a moment (libuv rebuilds its stream), so a save that
+	* happened while the app was starting is caught by looking at the file instead.
+	*/
+	#restartIfModified() {
+		if (this.#modifiedTime() !== this.#configModified) this.#queueRestart();
+	}
+	#modifiedTime() {
+		return statSync(this.#configPath, { throwIfNoEntry: false })?.mtimeMs;
+	}
+	async #restart() {
+		Log.info(`Config file "${this.#configName}" changed, restarting`);
+		this.#configModified = this.#modifiedTime();
+		const nextConfig = await this.#loadNextConfig();
+		if (!nextConfig) return;
+		let nextApp;
+		try {
+			nextApp = new App(nextConfig, this.#configPath);
+		} catch (error) {
+			Log.error("Failed to create the app, keeping the current server:");
+			console.error(error);
+			return;
+		}
+		try {
+			await this.#app.close();
+			this.#app = nextApp;
+			this.#config = nextConfig;
+			await nextApp.run();
+			this.#restartIfModified();
+		} catch (error) {
+			Log.error(`Restart failed, nothing is served until "${this.#configName}" is fixed and saved again:`);
+			console.error(error);
+			await this.#app.close();
+		}
+	}
+	/** The config to restart with, or nothing when the current server is to be kept. */
+	async #loadNextConfig() {
+		const [nextConfig, configError] = await loadConfigFile(this.#configPath, this.#projectDirectory);
+		if (configError) {
+			Log.error(`Failed to load "${this.#configName}", keeping the current server:`);
+			console.error(configError);
+			return;
+		}
+		const reusedPlugins = this.#reusedPlugins(nextConfig);
+		if (reusedPlugins.length > 0) {
+			const names = reusedPlugins.map((plugin) => `"${plugin.name}"`).join(", ");
+			Log.error(`Keeping the current server: ${names} are the same plugin objects as before. Create plugins inside "${this.#configName}" so a reload gets fresh ones.`);
+			return;
+		}
+		nextConfig.production = false;
+		return nextConfig;
+	}
+	/**
+	* A plugin object belongs to one app. Plugins imported from another file come back as the same objects, since only the config
+	* file itself is evaluated again.
+	*/
+	#reusedPlugins(nextConfig) {
+		const currentPlugins = new Set((this.#config.plugins ?? []).flat());
+		return (nextConfig.plugins ?? []).flat().filter((plugin) => currentPlugins.has(plugin));
+	}
+};
 
 //#endregion
 export { HtmlInlineSvgPlugin, analyzeOutputPlugin, buildCliPlugin, bundlePackagesPlugin, convertFontsCliPlugin, convertImagePlugin, copyAssetsPlugin, coreHtmlPlugin, coreMarkdownPlugin, coreScriptPlugin, coreStylePlugin, coreSvgPlugin, coreWebManifestPlugin, customEasePlugin, developmentServerPlugin, generateFontFacesCliPlugin, htmlBuildTimeScript, htmlBundleScriptPlugin, htmlBundleStylePlugin, htmlEnvOnlyPlugin, htmlFragmentPlugin, htmlIifeScriptPlugin, htmlInlineScriptPlugin, htmlInlineStylePlugin, htmlInlineTextPlugin, htmlInsertPlugin, htmlLayoutPlugin, htmlMarkdownPlugin, htmlMergeStylesPlugin, htmlPagesPlugin, htmlPreloadPlugin, svgoPlugin as htmlSvgoPlugin, i18nPlugin, importAsStringPlugin, loadSourcesPlugin, materialYouCliPlugin, robotsTextPlugin, serveCliPlugin, serviceWorkerPlugin, sitemapPlugin, transformCssPlugin, transformJsPlugin, webManifestPlugin, writeFilesPlugin };