chore: watch for messages changes in dev generate script (#15950)

* chore: watch for messages changes in dev generate script

* no need for this to be async

* tweak

* guard

* only create one timeout

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>

packages/svelte/package.json

@@ -136,7 +136,7 @@
   ],
   "scripts": {
     "build": "node scripts/process-messages && rollup -c && pnpm generate:types && node scripts/check-treeshakeability.js",
-    "dev": "node scripts/process-messages && rollup -cw",
+    "dev": "node scripts/process-messages -w & rollup -cw",
     "check": "tsc --project tsconfig.runtime.json && tsc && cd ./tests/types && tsc",
     "check:watch": "tsc --watch",
     "generate:version": "node ./scripts/generate-version.js",

packages/svelte/scripts/process-messages/index.js

@@ -1,18 +1,23 @@
 // @ts-check
+import process from 'node:process';
 import fs from 'node:fs';
 import * as acorn from 'acorn';
 import { walk } from 'zimmerframe';
 import * as esrap from 'esrap';
 
-/** @type {Record<string, Record<string, { messages: string[], details: string | null }>>} */
-const messages = {};
-const seen = new Set();
-
 const DIR = '../../documentation/docs/98-reference/.generated';
-fs.rmSync(DIR, { force: true, recursive: true });
-fs.mkdirSync(DIR);
 
-for (const category of fs.readdirSync('messages')) {
+const watch = process.argv.includes('-w');
+
+function run() {
+	/** @type {Record<string, Record<string, { messages: string[], details: string | null }>>} */
+	const messages = {};
+	const seen = new Set();
+
+	fs.rmSync(DIR, { force: true, recursive: true });
+	fs.mkdirSync(DIR);
+
+	for (const category of fs.readdirSync('messages')) {
 		if (category.startsWith('.')) continue;
 
 		messages[category] = {};
@@ -54,6 +59,7 @@ for (const category of fs.readdirSync('messages')) {
 			}
 
 			sorted.sort((a, b) => (a.code < b.code ? -1 : 1));
+
 			fs.writeFileSync(
 				`messages/${category}/${file}`,
 				sorted.map((x) => x._.trim()).join('\n\n') + '\n'
@@ -65,7 +71,10 @@ for (const category of fs.readdirSync('messages')) {
 			'<!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->\n\n' +
 				Object.entries(messages[category])
 					.map(([code, { messages, details }]) => {
-					const chunks = [`### ${code}`, ...messages.map((message) => '```\n' + message + '\n```')];
+						const chunks = [
+							`### ${code}`,
+							...messages.map((message) => '```\n' + message + '\n```')
+						];
 
 						if (details) {
 							chunks.push(details);
@@ -77,13 +86,13 @@ for (const category of fs.readdirSync('messages')) {
 					.join('\n\n') +
 				'\n'
 		);
-}
+	}
 
-/**
+	/**
 	 * @param {string} name
 	 * @param {string} dest
 	 */
-function transform(name, dest) {
+	function transform(name, dest) {
 		const source = fs
 			.readFileSync(new URL(`./templates/${name}.js`, import.meta.url), 'utf-8')
 			.replace(/\r\n/g, '\n');
@@ -397,13 +406,36 @@ function transform(name, dest) {
 				module.code,
 			'utf-8'
 		);
+	}
+
+	transform('compile-errors', 'src/compiler/errors.js');
+	transform('compile-warnings', 'src/compiler/warnings.js');
+
+	transform('client-warnings', 'src/internal/client/warnings.js');
+	transform('client-errors', 'src/internal/client/errors.js');
+	transform('server-errors', 'src/internal/server/errors.js');
+	transform('shared-errors', 'src/internal/shared/errors.js');
+	transform('shared-warnings', 'src/internal/shared/warnings.js');
 }
 
-transform('compile-errors', 'src/compiler/errors.js');
+if (watch) {
-transform('compile-warnings', 'src/compiler/warnings.js');
+	let running = false;
+	let timeout;
+
+	fs.watch('messages', { recursive: true }, (type, file) => {
+		if (running) {
+			timeout ??= setTimeout(() => {
+				running = false;
+				timeout = null;
+			});
+		} else {
+			running = true;
+
+			// eslint-disable-next-line no-console
+			console.log('Regenerating messages...');
+			run();
+		}
+	});
+}
 
-transform('client-warnings', 'src/internal/client/warnings.js');
+run();
-transform('client-errors', 'src/internal/client/errors.js');
-transform('server-errors', 'src/internal/server/errors.js');
-transform('shared-errors', 'src/internal/shared/errors.js');
-transform('shared-warnings', 'src/internal/shared/warnings.js');