feat(desktop): add electron-debug for improved development experience

apps/desktop/package.json

@@ -33,6 +33,7 @@
     "compare-versions": "^6.1.1",
     "crypto-js": "^4.2.0",
     "drizzle-orm": "^0.36.4",
+    "electron-debug": "^4.1.0",
     "electron-store": "^10.0.0",
     "electron-updater": "^6.3.9",
     "element-plus": "^2.8.7",

apps/desktop/src/main/index.ts

@@ -2,18 +2,26 @@ import { join } from 'node:path'
 import { electronApp, is, optimizer } from '@electron-toolkit/utils'
 import { eq } from 'drizzle-orm'
 import { app, BrowserWindow, ipcMain, shell } from 'electron'
+import debug from 'electron-debug'
 import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
 import icon from '../../resources/icon.png?asset'
 import { db, execute, runMigrate } from '../database/db.main'
 import { type SelectSettings, settings } from '../database/schemas/settings'
 import { useInstallCLI } from './installCLI'
 import { useAppUpdater } from './update'
 
+debug()
+
 // const IsMacOS = process.platform === 'darwin'
 
 let existingSettings: SelectSettings | undefined
 
 async function createWindow() {
+  if (is.dev) {
+    installExtension(VUEJS_DEVTOOLS)
+      .catch(err => console.error('An error occurred: ', err))
+  }
+
   existingSettings = await db.query.settings.findFirst()
   if (!existingSettings) {
     await db.insert(settings).values({})
@@ -52,14 +60,6 @@ async function createWindow() {
     mainWindow.show()
   })
 
-  mainWindow.webContents.on('did-frame-finish-load', async () => {
-    if (is.dev) {
-      installExtension(VUEJS_DEVTOOLS)
-        .then(() => mainWindow.webContents.openDevTools())
-        .catch(err => console.error('An error occurred: ', err))
-    }
-  })
-
   mainWindow.on('resize', async () => {
     const { width, height } = mainWindow.getBounds()
     const data = await db.query.settings.findFirst()