Electron 报错 Error: Electron >=v13.0.0-beta.6 required to support sandboxed renderers

Error: Electron >=v13.0.0-beta.6 required to support sandboxed renderers

Electron 项目架构叙述:

Vue3 + TypeScript + electron 使用 electron-builder 集成 electron-vue 自带最高可以选择electron^13.0.0 (嫌弃。。。)

electron

毕竟目前最新版本都到electron^23.2.0+了,但是没得办法Vue3香的嘞,原不想写折腾原生HTML+CSS+JS那一套,也不想写 Angular React ~

暂时找不到更好的集成方案,再加上项目进度迫在眉睫实属无奈之举,当然如果你有更好的方案可以推荐一下最好是Vue3 Vue vue…,在这里先向各位说一声谢谢啦…

我想要实现的用法 在渲染进程中即Vue Setup中使用 remote 模块

原先写法:

在 background.ts 中
// 引入
import * as remote from '@electron/remote/main';
// 初始化
remote.initialize();
// 监听应用的启动事件
app.on('ready', async () => {
// 创建设置子窗口
const window = new BrowserWindow({
	// 配置此次省略...
	{
      // 使用remote模块,electron10x还是多少来着 版本之后废除了,需要自己安装...
      enableRemoteModule: true, // 老版本14x之前开启就可以使用了
	}
});
// 使用remote模块,electron13之后 开启remote
// remote.enable(window.webContents);
})
在 渲染进程 vue 中
<script lang="ts" setup>
import {dialog} from '@electron/remote'
// 打开dialog
const openDialog = () => {
      dialog.showMessageBox({
        // 其它省略...
        message: '香的嘞~'
      })
})
<script/>
在 调试控制台 中…

在这里插入图片描述

vue-router.mjs?f169:3451 Error: Electron >=v13.0.0-beta.6 required to support sandboxed renderers
    at getContextId (webpack-internal:///./node_modules/@electron/remote/dist/src/renderer/remote.js:48)
    at eval (webpack-internal:///./node_modules/@electron/remote/dist/src/renderer/remote.js:52)
    at Object../node_modules/@electron/remote/dist/src/renderer/remote.js (create-class.js:128)
    at __webpack_require__ (app.js:539)
    at fn (app.js:780)
    at eval (webpack-internal:///./node_modules/@electron/remote/dist/src/renderer/index.js:23)
    at Object../node_modules/@electron/remote/dist/src/renderer/index.js (create-class.js:117)
    at __webpack_require__ (app.js:539)
    at fn (app.js:780)
    at eval (webpack-internal:///./node_modules/@electron/remote/renderer/index.js:1)

这才是重点解决方法 在渲染进程 Vue 中:

<script lang="ts" setup>
// import {dialog} from '@electron/remote' // 原来引入方式electron13版本之后的使用方式
const { remote } = window.require('electron') // + New 引入方式(没办法版本太老了这也就是为什么我嫌弃的原因,因为这种引入方式在 electron13x 版本之后废除了......)
// 打开dialog
const openDialog = () => {
	  // 原
      /* 
      dialog.showMessageBox({
        // 其它省略...
        message: '香的嘞~'
      })
      */
		// 改
	   remote.dialog.showMessageBox({
        // 其它省略...
        message: '不香的嘞~'
      })
})
<script/>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值