fix: handle hmr properly

Author: twlite

apps/test-bot/src/app/commands/(general)/dog.ts

@@ -6,7 +6,7 @@ export const command: CommandData = {
 };
 
 export const chatInput: SlashCommand = async (ctx) => {
-  await ctx.interaction.reply('Hello from dog!');
+  await ctx.interaction.reply('Hello from dog command!');
 };
 
 export const message: MessageCommand = async (ctx) => {

bun.lock

@@ -3,39 +3,39 @@
   "version": "0.0.0",
   "private": true,
   "license": "MIT",
+  "workspaces": [
+    "packages/*",
+    "apps/*"
+  ],
   "scripts": {
-    "dev": "turbo dev",
-    "lint": "turbo lint && prettier --check ./ --ignore-path=.prettierignore",
-    "build": "turbo lint && turbo build",
-    "publish-package": "turbo publish-package",
-    "docgen": "tsx ./scripts/docgen.ts && pnpm format",
+    "lint": "bun lint --filter=\"./packages/*\" && prettier --check ./ --ignore-path=.prettierignore",
+    "build": "bun run --filter=\"./packages/*\" build",
+    "publish-package": "bun publish-package",
+    "build-docs": "bun run --filter=\"./apps/website\" build",
+    "docgen": "tsx ./scripts/docgen.ts && bun format",
     "format": "prettier --write ./ --ignore-path=.prettierignore"
   },
   "devDependencies": {
     "@types/node": "^22.10.2",
     "micro-docgen": "^0.3.5",
     "prettier": "^3.0.3",
-    "tsx": "^4.7.0",
-    "turbo": "^2.3.3"
+    "tsx": "^4.7.0"
   },
-  "packageManager": "pnpm@9.15.0",
-  "pnpm": {
-    "overrides": {
-      "katex@>=0.11.0 <0.16.10": ">=0.16.10",
-      "katex@>=0.15.4 <0.16.10": ">=0.16.10",
-      "katex@>=0.10.0-beta <0.16.10": ">=0.16.10",
-      "vite@>=5.0.0 <=5.0.12": ">=5.0.13",
-      "braces@<3.0.3": ">=3.0.3",
-      "micromatch@<4.0.8": ">=4.0.8",
-      "vite@>=5.0.0 <=5.1.7": ">=5.1.8",
-      "vite@>=5.0.0 <5.1.8": ">=5.1.8",
-      "rollup@>=4.0.0 <4.22.4": ">=4.22.4",
-      "cross-spawn@>=7.0.0 <7.0.5": ">=7.0.5",
-      "nanoid@<3.3.8": "3.3.8",
-      "next@>=15.0.0 <15.1.2": ">=15.1.2",
-      "undici@>=6.0.0 <6.21.1": ">=6.21.1",
-      "vite@>=6.0.0 <=6.0.8": ">=6.0.9",
-      "katex@>=0.12.0 <=0.16.20": ">=0.16.21"
-    }
+  "overrides": {
+    "katex@>=0.11.0 <0.16.10": ">=0.16.10",
+    "katex@>=0.15.4 <0.16.10": ">=0.16.10",
+    "katex@>=0.10.0-beta <0.16.10": ">=0.16.10",
+    "vite@>=5.0.0 <=5.0.12": ">=5.0.13",
+    "braces@<3.0.3": ">=3.0.3",
+    "micromatch@<4.0.8": ">=4.0.8",
+    "vite@>=5.0.0 <=5.1.7": ">=5.1.8",
+    "vite@>=5.0.0 <5.1.8": ">=5.1.8",
+    "rollup@>=4.0.0 <4.22.4": ">=4.22.4",
+    "cross-spawn@>=7.0.0 <7.0.5": ">=7.0.5",
+    "nanoid@<3.3.8": "3.3.8",
+    "next@>=15.0.0 <15.1.2": ">=15.1.2",
+    "undici@>=6.0.0 <6.21.1": ">=6.21.1",
+    "vite@>=6.0.0 <=6.0.8": ">=6.0.9",
+    "katex@>=0.12.0 <=0.16.20": ">=0.16.21"
   }
 }

package.json

@@ -1,9 +1,17 @@
-import { spawn } from 'node:child_process';
-import { DevEnv, devEnvFileArgs, prodEnvFileArgs } from './env';
+import { IOType, spawn } from 'node:child_process';
+import { DevEnv } from './env';
 import { join } from 'node:path';
 import { existsSync } from 'node:fs';
 import { panic } from './common';
 
+function getStdio(supportsCommands: boolean) {
+  if (supportsCommands) {
+    return ['pipe', 'pipe', 'pipe', 'ipc'];
+  }
+
+  return ['pipe', 'pipe', 'pipe'];
+}
+
 export function createAppProcess(
   fileName: string,
   cwd: string,
@@ -13,6 +21,8 @@ export function createAppProcess(
     panic(`Could not locate the entrypoint file: ${fileName}`);
   }
 
+  const stdio = getStdio(isDev) as IOType[];
+
   const ps = spawn(
     'node',
     [
@@ -21,10 +31,10 @@ export function createAppProcess(
       fileName,
     ],
     {
-      cwd: cwd,
+      cwd,
       windowsHide: true,
       env: DevEnv(),
-      stdio: ['pipe', 'pipe', 'pipe'],
+      stdio,
     },
   );
 

packages/commandkit/src/cli/app-process.ts

@@ -4,10 +4,10 @@ import { isCompilerPlugin } from '../plugins';
 import { createAppProcess } from './app-process';
 import { buildApplication } from './build';
 import { watch } from 'chokidar';
-import { ChildProcessWithoutNullStreams } from 'child_process';
 import { readdirSync } from 'node:fs';
 import { debounce } from '../utils/utilities';
 import colors from '../utils/colors';
+import { ChildProcess } from 'node:child_process';
 
 async function buildAndStart(configPath: string, skipStart = false) {
   const config = await loadConfigFile(configPath);
@@ -22,7 +22,13 @@ async function buildAndStart(configPath: string, skipStart = false) {
 
   if (skipStart) return null as never;
 
-  return createAppProcess(mainFile, configPath, true);
+  const ps = createAppProcess(mainFile, configPath, true);
+
+  ps.on('message', (message) => {
+    console.log(`Received message from child process: ${message}`);
+  });
+
+  return ps;
 }
 
 const isCommandSource = (p: string) =>
@@ -42,17 +48,18 @@ export async function bootstrapDevelopmentServer(configPath?: string) {
     ignoreInitial: true,
   });
 
-  let ps: ChildProcessWithoutNullStreams | null = null;
+  let ps: ChildProcess | null = null;
 
   const performHMR = debounce(async (path?: string): Promise<boolean> => {
     if (!path || !ps) return false;
+    if (!ps.send) return false;
 
     if (isCommandSource(path)) {
       console.log(
         `${colors.cyanBright('Reloading command(s) at ')} ${colors.yellowBright(path)}`,
       );
       await buildAndStart(cwd, true);
-      ps.stdin.write(`COMMANDKIT_EVENT=reload-commands|${path}\n`);
+      ps.send({ event: 'reload-commands', path });
       return true;
     }
 
@@ -61,7 +68,7 @@ export async function bootstrapDevelopmentServer(configPath?: string) {
         `${colors.cyanBright('Reloading event(s) at ')} ${colors.yellowBright(path)}`,
       );
       await buildAndStart(cwd, true);
-      ps.stdin.write(`COMMANDKIT_EVENT=reload-events|${path}\n`);
+      ps.send({ event: 'reload-events', path });
       return true;
     }
 
@@ -70,15 +77,20 @@ export async function bootstrapDevelopmentServer(configPath?: string) {
         `${colors.cyanBright('Reloading locale(s) at ')} ${colors.yellowBright(path)}`,
       );
       await buildAndStart(cwd, true);
-      ps.stdin.write(`COMMANDKIT_EVENT=reload-locales|${path}\n`);
+      ps.send({ event: 'reload-locales', path });
       return true;
     }
 
     return false;
   }, 300);
 
   const hmrHandler = async (path: string) => {
-    if (await performHMR(path)) return;
+    const hmr = await performHMR(path);
+    if (hmr) return;
+
+    console.log(
+      `${colors.yellowBright('⚡️ Performing full restart due to the changes in')} ${colors.cyanBright(path)}`,
+    );
 
     ps?.kill();
 
@@ -97,15 +109,15 @@ export async function bootstrapDevelopmentServer(configPath?: string) {
         break;
       case 'rc':
         console.log(`Received reload commands command, reloading...`);
-        ps?.stdin.write(`COMMANDKIT_EVENT=reload-commands\n`);
+        ps?.send({ event: 'reload-commands' });
         break;
       case 're':
         console.log(`Received reload events command, reloading...`);
-        ps?.stdin.write(`COMMANDKIT_EVENT=reload-events\n`);
+        ps?.send({ event: 'reload-events' });
         break;
       case 'rl':
         console.log(`Received reload locales command, reloading...`);
-        ps?.stdin.write(`COMMANDKIT_EVENT=reload-locales\n`);
+        ps?.send({ event: 'reload-locales' });
         break;
     }
   });

packages/commandkit/src/cli/development.ts

@@ -2,19 +2,23 @@ import type { CommandKit } from '../CommandKit';
 import { Logger } from '../logger/Logger';
 import { COMMANDKIT_IS_DEV } from './constants';
 
-const EVENT_PATTERN = /^COMMANDKIT_EVENT=(\w+)(\|(.+))?$/;
+interface IpcMessageCommand {
+  event: string;
+  path?: string;
+}
 
 export function registerDevHooks(commandkit: CommandKit) {
   if (!COMMANDKIT_IS_DEV) return;
 
-  process.stdin.on('data', (chunk) => {
-    const input = chunk.toString().trim();
+  process.on('message', (message) => {
+    if (typeof message !== 'object' || message === null) return;
 
-    const match = input.match(EVENT_PATTERN);
-    if (!match) return;
+    const { event, path } = message as IpcMessageCommand;
+    if (!event) return;
 
-    const [, event, , path] = match;
-    Logger.info(`Received HMR event: ${event}${path ? ` for ${path}` : ''}`);
+    if (process.env.COMMANDKIT_DEBUG_HMR === 'true') {
+      Logger.info(`Received HMR event: ${event}${path ? ` for ${path}` : ''}`);
+    }
 
     switch (event) {
       case 'reload-commands':

packages/commandkit/src/utils/dev-hooks.ts

@@ -42,15 +42,24 @@ export function debounce<R, F extends (...args: any[]) => R>(
   ms: number,
 ): F {
   let timer: NodeJS.Timeout | null = null;
+  let resolve: ((value: R | PromiseLike<R>) => void) | null = null;
 
   return ((...args: any[]) => {
     if (timer) {
       clearTimeout(timer);
+      if (resolve) {
+        resolve(null as unknown as R); // Resolve with null if debounced
+      }
     }
 
-    timer = setTimeout(() => {
-      fn(...args);
-      timer = null;
-    }, ms);
+    return new Promise<R>((res) => {
+      resolve = res;
+      timer = setTimeout(() => {
+        const result = fn(...args);
+        res(result);
+        timer = null;
+        resolve = null;
+      }, ms);
+    });
   }) as F;
 }