Electron - Getting Started
文章目录

Electron - Getting Started

Main Thread & Child Thread

Package.json 入口默认就是一个主线程

主线程里面会开启一些子线程以及渲染线程

有些时候需要将主线程于子线程通信才能够实现一些功能.

electron-forge

这个是个 Electron 开发套件, 里面简化了一些打包功能.

Start Dev

1
2
3
yarn create electron-app my-app
cd my-app
yarn start

Build

1
yarn make

Troubleshooting

1
yarn make

打包的时候遇到错误

1
EPERM: operation not permitted, symlink .....

这个时候就需要用管理员权限打开 powershell 然后重新打包

打包后发现 Cannot find modules

一般遇到这个情况就是将一些必要的 package 扔到了 devDependencies.

移动到 dependencies 试一试

Cheatsheet

Main thread send msg to Render thread

Main thread:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import {
app,
BrowserWindow,
globalShortcut
} from 'electron';

mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true,
},
});

mainWindow.webContents.send('eventName', 'arg');

Render thread:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
import {
ipcRenderer
} from 'electron';

window.onload = () => {
const btn = document.querySelector('#btn');

btn.onclick = () => {
/* ... */
};

ipcRenderer.on('eventName', (event, arg) => {
btn.onclick();
});

};