Split custom electron plugin to separate files.

infrastructure/ElectronViteApp.ts

@@ -0,0 +1,58 @@
+import type { ViteDevServer } from 'vite';
+import { spawn, type ChildProcess } from 'node:child_process';
+import electronPath from 'electron';
+
+export class ViteElectronApp {
+  current!: ChildProcess;
+
+  busy = false;
+  attemptedStartWhenBusy = false;
+
+  constructor(public server: ViteDevServer) {
+    this.start();
+  }
+
+  /** Attempts to kill the current instance, then starts a new instace of the electron app. */
+  start() {
+    if (this.busy) {
+      this.attemptedStartWhenBusy = true;
+      return;
+    }
+    this.busy = true;
+    this.close();
+
+    // Spawn new electron process
+    // eslint-disable-next-line @typescript-eslint/no-base-to-string
+    this.current = spawn(String(electronPath), ['--inspect=9223', '.'], { stdio: 'inherit' });
+
+    // Stops the watch script when the application has been quit
+    this.current.addListener('exit', () => {
+      this.server.close().catch(console.error);
+    });
+
+    this.busy = false;
+    this.restartIfRequired();
+  }
+
+  /** Kills the current instance */
+  close(restart = false) {
+    if (!this.current) return;
+
+    this.busy = true;
+
+    this.current.removeAllListeners('exit');
+    this.current.on('exit', () => {
+      this.busy = false;
+      if (restart) this.start();
+    });
+    this.current.kill('SIGINT');
+  }
+
+  restartIfRequired() {
+    if (!this.attemptedStartWhenBusy) return;
+
+    console.warn('... restarting because required...');
+    this.attemptedStartWhenBusy = false;
+    this.close(true);
+  }
+}

infrastructure/viteElectronAppPlugin.ts

@@ -0,0 +1,38 @@
+import type { PluginOption } from 'vite';
+import { ViteElectronApp } from './ElectronViteApp';
+import path from 'node:path';
+import { readFile } from 'node:fs/promises';
+
+export function viteElectronAppPlugin(): PluginOption {
+  let electronApp: ViteElectronApp;
+
+  return {
+    name: 'Electron App reload on save',
+    apply: 'serve',
+    async hotUpdate({ file }) {
+      if (this.environment.name !== 'client') return;
+      console.debug('hotUpdate');
+
+      // Reload app on file change
+      const relative = path.relative('.', file);
+
+      // Invalidate modules manually
+      const json = await readFile(path.join(process.cwd(), 'tsconfig.build.json'));
+      const parsed: unknown = JSON.parse(json.toString());
+
+      if (typeof parsed === 'object' && parsed && 'include' in parsed && Array.isArray(parsed.include)) {
+        for (const include of parsed.include) {
+          console.log(include);
+          if (typeof include === 'string' && path.matchesGlob(relative, include)) electronApp.start();
+        }
+      }
+      return [];
+    },
+    configureServer(server) {
+      electronApp = new ViteElectronApp(server);
+    },
+    buildEnd() {
+      electronApp.close();
+    },
+  };
+}

tsconfig.json

@@ -21,5 +21,12 @@
   },
   "exclude": [".history", ".vite", "assets", "dist", "node_modules", "out"],
   // Include JS files so they are covered by projectService (ESLint)
-  "include": ["src/**/*", "*.ts", "*.js", "scripts/**/*", "tests/**/*"]
+  "include": [
+    "src/**/*",
+    "*.ts",
+    "*.js",
+    "infrastructure/**/*",
+    "scripts/**/*",
+    "tests/**/*"
+  ]
 }

vite.main.config.ts

@@ -1,73 +1,13 @@
 /// <reference types="vitest/config" />
-import type { UserConfig, ViteDevServer } from 'vite';
+import { UserConfig } from 'vite';
 import { defineConfig, mergeConfig } from 'vite';
 import { getBuildConfig, external, pluginHotRestart } from './vite.base.config';
+import { viteElectronAppPlugin } from './infrastructure/viteElectronAppPlugin';
 import { sentryVitePlugin } from '@sentry/vite-plugin';
 import { version } from './package.json';
-import { ChildProcess, spawn } from 'node:child_process';
-import electronPath from 'electron';
-import { readFile } from 'node:fs/promises';
-import path from 'node:path';
-
-class SingletonElectronApp {
-  current!: ChildProcess;
-
-  busy = false;
-  triedToStartWhilstBusy = false;
-
-  constructor(public server: ViteDevServer) {
-    this.start();
-  }
-
-  /** Attempts to kill the current instance, then starts a new instace of the electron app. */
-  start() {
-    if (this.busy) {
-      this.triedToStartWhilstBusy = true;
-      return;
-    }
-    this.busy = true;
-    this.close();
-
-    // Spawn new electron process
-    // eslint-disable-next-line @typescript-eslint/no-base-to-string
-    this.current = spawn(String(electronPath), ['--inspect=9223', '.'], { stdio: 'inherit' });
-
-    // Stops the watch script when the application has been quit
-    this.current.addListener('exit', () => {
-      this.server.close().catch(console.error);
-    });
-
-    this.busy = false;
-    this.restartIfRequired();
-  }
-
-  /** Kills the current instance */
-  close(restart = false) {
-    if (!this.current) return;
-
-    this.busy = true;
-
-    this.current.removeAllListeners('exit');
-    this.current.on('exit', () => {
-      this.busy = false;
-      if (restart) this.start();
-    });
-    this.current.kill('SIGINT');
-  }
-
-  restartIfRequired() {
-    if (!this.triedToStartWhilstBusy) return;
-
-    console.warn('... restarting because required...');
-    this.triedToStartWhilstBusy = false;
-    this.close(true);
-  }
-}
 
 // https://vitejs.dev/config
 export default defineConfig((env) => {
-  let electronApp: SingletonElectronApp;
-
   const config: UserConfig = {
     build: {
       outDir: '.vite/build',
@@ -88,34 +28,8 @@ export default defineConfig((env) => {
       },
     },
     plugins: [
-      {
-        name: 'hotUpdate Plugin',
-        apply: 'serve',
-        async hotUpdate({ file }) {
-          if (this.environment.name !== 'client') return;
-          console.warn('hotUpdate');
-
-          // Reload app on file change
-          const relative = path.relative('.', file);
-
-          // Invalidate modules manually
-          const json = await readFile(path.join(process.cwd(), 'tsconfig.build.json'));
-          const parsed: unknown = JSON.parse(json.toString());
-          if (typeof parsed === 'object' && parsed && 'include' in parsed && Array.isArray(parsed.include)) {
-            for (const include of parsed.include) {
-              console.log(include);
-              if (typeof include === 'string' && path.matchesGlob(relative, include)) electronApp.start();
-            }
-          }
-          return [];
-        },
-        configureServer(server) {
-          electronApp = new SingletonElectronApp(server);
-        },
-        buildEnd() {
-          electronApp.close();
-        },
-      },
+      // Custom hot reload solution for vite 6
+      viteElectronAppPlugin(),
       pluginHotRestart('restart'),
       process.env.NODE_ENV === 'production'
         ? sentryVitePlugin({