【vite+vue3+ts】模块electron没有导出的成员ipcRenderer

ipcRenderer报错的问题

今天在把vue打包成electron项目时遇到了一个问题
我们通过ipcRenderer API渲染进程才可以跟主进程通信

在使用electron API ：ipcRenderer时，编辑器ts监测到了错误

在浏览器端也同样出现了electron的报错

dev

在dev开发模式下，electron又正常打开，并进行进程通信

即quit方法是可以正常向主进程通信的

build

但是在build打包时，electron报错了

elctron的报错原因

electron新版本默认禁止页面中直接操作 electron的相关api

解决方案

为了方便我们主进程与渲染进程的通信，我们借助vueuse插件库中的一个插件@vueuse/electron来简化我们的工作，具体使用方式可以查看官网 @vueuse/electron。

安装@vueuse/electron：

npm install @vueuse/electron -D

使用：

import { useIpcRenderer } from "@vueuse/electron";
const ipcRenderer = useIpcRenderer()

// 确认退出
const quit = () => {
  ipcRenderer.send('close')
}

然后就可以正常打包了