vuecli3创建electron项目操作及通信方法

使用vue-cli3手动搭建electron项目

1. vue create project // project 项目名称
2. vue add electron-builder -->选择版本
   • 目录src下新增了background.js
   • 修改了package.json文件
   • 运行命令：npm run electron:serve

---

Electron API

链接：electron API入口

组件中如何进行通信

组件中

// ipc：渲染进程对象
const ipc = !!window.require ? window.require('electron').ipcRenderer : null;

methods: {
            handleClick(e) {
                !!ipc && ipc.send('asynchronous-message', '我是消息内容'); // 异步发送，asynchronous-message：监听事件名
            }
        }

主进程background.js中

// ipc：主进程对象
const ipc = require('electron').ipcMain;
// 监听asynchronous-message事件
ipc.on('asynchronous-message', (event, param) => {
	 console.log(param); //接收到的参数：我是消息内容
	 }

---

具体可查看官网API的ipcMain和ipcRenderer进行通信操作。
打包称exe文件请自行查阅。