add preload.js

src/main/app.ts

@@ -1,16 +1,19 @@
 import { app, BrowserWindow } from 'electron'
+import {join} from "path";
 
 function createWindow() {
     const win = new BrowserWindow({
         width: 800,
         height: 600,
         webPreferences: {
-            nodeIntegration: true
+            nodeIntegration: true,
+            preload: join(__dirname, 'preload.js')
         }
     })
 
     if (process.env.NODE_ENV === 'development') {
         win.loadURL('http://localhost:3000/')
+        win.webContents.openDevTools()
     } else {
         win.loadFile('dist/render/index.html')
     }

src/main/preload.js

@@ -0,0 +1,20 @@
+const {ipcRenderer, contextBridge} = require('electron')
+
+contextBridge.exposeInMainWorld('ipcRenderer', {
+    send: (channel, data) => {
+        // whitelist channels
+        let validChannels = ['toMain']
+        if (validChannels.includes(channel)) {
+          ipcRenderer.send(channel, data)
+        }
+        ipcRenderer.send(channel, data)
+    },
+    receive: (channel, func) => {
+        let validChannels = ['fromMain']
+        if (validChannels.includes(channel)) {
+          // Deliberately strip event as it includes `sender`
+          ipcRenderer.on(channel, (event, ...args) => func(...args))
+        }
+        ipcRenderer.on(channel, (event, ...args) => func(...args))
+    }
+})