Merge pull request #18 from CallanBi/chore/add-main-debug-mode

chore: add debug mode for main process

.vscode/launch.json

@@ -0,0 +1,39 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "node",
+      "request": "launch",
+      "name": "Main(inspector)",
+      "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
+      "runtimeArgs": [
+        "--remote-debugging-port=9222",
+        "${workspaceFolder}/dist/main/index.cjs",
+      ],
+      "env": {
+        "DEBUG": "true",
+      },
+      "windows": {
+        "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
+      },
+      "sourceMaps": true
+    },
+    {
+      "type": "node",
+      "request": "launch",
+      "name": "Main(vite)",
+      "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
+      "runtimeArgs": [
+        "${workspaceFolder}/dist/main/index.cjs",
+      ],
+      "env": {
+        "VITE_DEV_SERVER_HOST": "127.0.0.1",
+        "VITE_DEV_SERVER_PORT": "3344",
+      },
+      "windows": {
+        "runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron.cmd"
+      },
+      "sourceMaps": true
+    },
+  ]
+}

.vscode/task.json

@@ -0,0 +1,13 @@
+{
+  "version": "2.0.0",
+  "tasks": [
+    {
+      "type": "npm",
+      "script": "debug",
+      "problemMatcher": [],
+      "label": "npm: debug",
+      "detail": "cross-env-shell NODE_ENV=debug \"npm run typecheck && node scripts/build.mjs && vite ./packages/renderer\"",
+      "group": "build"
+    }
+  ]
+}

package-lock.json

@@ -5,7 +5,6 @@
   "requires": true,
   "packages": {
     "": {
-      "name": "vite-react-electron",
       "version": "1.0.0",
       "license": "MIT",
       "dependencies": {
@@ -15,6 +14,7 @@
         "@types/react": "^17.0.39",
         "@types/react-dom": "^17.0.11",
         "@vitejs/plugin-react": "^1.2.0",
+        "cross-env": "^7.0.3",
         "electron": "^17.0.0",
         "electron-builder": "^22.14.13",
         "react": "^17.0.2",
@@ -852,6 +852,8 @@
       "version": "8.10.0",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.10.0.tgz",
       "integrity": "sha512-bzqAEZOjkrUMl2afH8dknrq5KEk2SrwdBROR+vH1EKVQTqaUbJVPdc/gEdggTMM0Se+s+Ja4ju4TlNcStKl2Hw==",
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.1",
         "json-schema-traverse": "^1.0.0",
@@ -866,7 +868,9 @@
     "node_modules/ajv-formats/node_modules/json-schema-traverse": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
-      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="
+      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
+      "optional": true,
+      "peer": true
     },
     "node_modules/ajv-keywords": {
       "version": "3.5.2",
@@ -1880,6 +1884,24 @@
         "buffer": "^5.1.0"
       }
     },
+    "node_modules/cross-env": {
+      "version": "7.0.3",
+      "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.3.tgz",
+      "integrity": "sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==",
+      "dev": true,
+      "dependencies": {
+        "cross-spawn": "^7.0.1"
+      },
+      "bin": {
+        "cross-env": "src/bin/cross-env.js",
+        "cross-env-shell": "src/bin/cross-env-shell.js"
+      },
+      "engines": {
+        "node": ">=10.14",
+        "npm": ">=6",
+        "yarn": ">=1"
+      }
+    },
     "node_modules/cross-spawn": {
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
@@ -5960,14 +5982,13 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-2.1.1.tgz",
       "integrity": "sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==",
-      "requires": {
+      "requires": {},
-        "ajv": "^8.0.0"
-      },
       "dependencies": {
         "ajv": {
-          "version": "8.10.0",
+          "version": "https://registry.npmjs.org/ajv/-/ajv-8.10.0.tgz",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.10.0.tgz",
           "integrity": "sha512-bzqAEZOjkrUMl2afH8dknrq5KEk2SrwdBROR+vH1EKVQTqaUbJVPdc/gEdggTMM0Se+s+Ja4ju4TlNcStKl2Hw==",
+          "optional": true,
+          "peer": true,
           "requires": {
             "fast-deep-equal": "^3.1.1",
             "json-schema-traverse": "^1.0.0",
@@ -5978,7 +5999,9 @@
         "json-schema-traverse": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
-          "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="
+          "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
+          "optional": true,
+          "peer": true
         }
       }
     },
@@ -6755,6 +6778,15 @@
         "buffer": "^5.1.0"
       }
     },
+    "cross-env": {
+      "version": "7.0.3",
+      "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.3.tgz",
+      "integrity": "sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==",
+      "dev": true,
+      "requires": {
+        "cross-spawn": "^7.0.1"
+      }
+    },
     "cross-spawn": {
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",

package.json

@@ -10,7 +10,8 @@
   "scripts": {
     "dev": "node scripts/watch.mjs",
     "build": "npm run typecheck && node scripts/build.mjs && electron-builder --config .electron-builder.config.js",
-    "typecheck": "tsc --noEmit --project packages/renderer/tsconfig.json"
+    "typecheck": "tsc --noEmit --project packages/renderer/tsconfig.json",
+    "debug": "cross-env-shell NODE_ENV=debug \"npm run typecheck && node scripts/build.mjs && vite ./packages/renderer\""
   },
   "engines": {
     "node": ">=14.17.0"
@@ -22,6 +23,7 @@
     "@types/react": "^17.0.39",
     "@types/react-dom": "^17.0.11",
     "@vitejs/plugin-react": "^1.2.0",
+    "cross-env": "^7.0.3",
     "electron": "^17.0.0",
     "electron-builder": "^22.14.13",
     "react": "^17.0.2",

packages/main/index.ts

@@ -24,7 +24,7 @@ async function createWindow() {
     },
   })
 
-  if (app.isPackaged) {
+  if (app.isPackaged || process.env['DEBUG']) {
     win.loadFile(join(__dirname, '../renderer/index.html'))
   } else {
     // 🚧 Use ['ENV_NAME'] avoid vite:define plugin

packages/main/vite.config.ts

@@ -12,6 +12,7 @@ export default defineConfig({
       fileName: () => '[name].cjs',
     },
     minify: process.env./* from mode option */NODE_ENV === 'production',
+    sourcemap: process.env./* from mode option */NODE_ENV === 'debug',
     emptyOutDir: true,
     rollupOptions: {
       external: [

packages/renderer/vite.config.ts

@@ -28,6 +28,7 @@ export default defineConfig({
   base: './',
   build: {
     emptyOutDir: true,
+    sourcemap: process.env.NODE_ENV === 'debug',
     outDir: '../../dist/renderer',
   },
   resolve: {

scripts/build.mjs

@@ -1,5 +1,8 @@
 import { build } from 'vite'
 
-await build({ configFile: 'packages/main/vite.config.ts' })
+await build({
+  configFile: 'packages/main/vite.config.ts',
+  mode: process.env.NODE_ENV === 'debug' ? 'debug' : 'production'
+})
 await build({ configFile: 'packages/preload/vite.config.ts' })
 await build({ configFile: 'packages/renderer/vite.config.ts' })

types.d.ts

@@ -1,7 +1,7 @@
 
 declare namespace NodeJS {
   interface ProcessEnv {
-    NODE_ENV: 'development' | 'production'
+    NODE_ENV: 'development' | 'production' | 'debug'
     readonly VITE_DEV_SERVER_HOST: string
     readonly VITE_DEV_SERVER_PORT: string
   }