原因:因为原生的最大化最小化按钮太丑了,只好自己写在页面上,所以涉及到了ipcRenderer通信问题,引发了fs.existsSync is not a function报错,

看到发的杂七杂八的,这样那样,什么vue-electron,鬼扯,我下了个vue-electron发现竟然用const stack=*** 下面又用const stack=*** 什么人啊这是,发到npm上让我们找坑?等坑找完了,发现打包后也就是一个index.html和main.js文件,有何用,我vuecli也能打包个index.html文件啊,main.js我可以自己编辑啊,浪费了大把时间,ipcRenderer还是没解决啊,最后还是回到原点

前面是根据知乎大佬的教程来的链接地址

按照上面在git上拉了electron项目直接就把打包好的vue项目放到指定的dist文件夹下了
然后运行就能显示,可是要和页面通信,就不行

解决

1.在electron里面的main.js中引入preload.js没有就创建
在这里插入图片描述

win = new BrowserWindow({
    transparent: true,
    frame: false,
    width: 1440,
    height: 900,
    webPreferences: { //开启自带node环境
      nodeIntegration: true,
      contextIsolation: false,
      preload: __dirname + '/preload.js'
    }
  })

2.在preload.js中添加window.ipcRenderer = require(‘electron’).ipcRenderer;
在这里插入图片描述
3.在vuecli的组件中,使用
在这里插入图片描述

打包后放到electron一起运行能解决问题,但是在vuecli本地开发的时候,肯定找不到window.ipcRenderer所以…所以看个人需要吧
Logo

前往低代码交流专区

更多推荐