Electron.js中使用exports和imports时报读取on属性错误如何解决？

问题原因 #

你遇到的报错和export/import语法本身无关，本质是错误地将Electron主进程入口文件作为普通模块导入到了渲染进程中执行。
Node.js加载模块时会先完整执行该模块的全部代码，再返回导出的对象。Electron的主进程和渲染进程是完全隔离的运行环境，只有主进程能直接获取app对象，渲染进程运行环境中不存在该对象，所以当你在渲染进程的another.js中引入主进程的index.js时，代码执行到app.on()就会抛出undefined的相关错误。

解决方案 #

Electron跨进程调用方法需要通过IPC（进程间通信）实现，不要直接跨进程导入入口文件，具体改造步骤如下：

1. 改造主进程index.js代码，监听IPC事件：

const { app, BrowserWindow, ipcMain } = require("electron")

var mainWindow = null

app.on("ready", () => {
    mainWindow = new BrowserWindow({
        "width": 500,
        "height": 500,
        "webPreferences": {
            "nodeIntegration": true,
            "contextIsolation": false
        }
    })

    mainWindow.loadFile("src/html/welcome.html")
})

// 监听渲染进程发来的调用请求
ipcMain.handle('updateFunction', (event, _name) => {
    console.log(_name)
    // 若需要返回值可直接return对应内容
})

2. 改造渲染进程another.js代码，通过IPC发送调用请求：

const { ipcRenderer } = require("electron");

// 调用主进程的对应方法
ipcRenderer.invoke('updateFunction', "Hellow")

如果有公共工具函数需要在主进程和渲染进程同时使用，建议将公共逻辑单独抽离为独立的工具文件（例如utils/common.js），两边分别引入即可，不要把主进程入口文件作为公共模块导出。

内容的提问来源于stack exchange，提问作者BladeOfLightX