Time: 2024-07-23 Tuesday 16:18:01
Author: Jackasher
Electron构建桌面应用
Electron的是npm下载的JS包,采用ES6导入,核心是app和BrowserWindow,app.on开启进程,然后new Browserwindow代表创建窗口
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
| const {app,BrowserWindow,ipcMain} = require("electron")
const path = require('path')
const fs = require('fs')
function writeFile(event,data){
console.log("Hi",event,data);
fs.writeFileSync("/Users/leojackasher/Documents/Word/electron.txt",data)
}
function readFile(){
return fs.readFileSync('/Users/leojackasher/Documents/Word/electron.txt').toString()
}
app.on('ready',() => {
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
preload:path.resolve(__dirname,'./preload.js')
}
})
ipcMain.on('file-save',writeFile)
ipcMain.handle('file-read',readFile)
win.loadFile('./pages/index.html')
})
|
代码解释
用于注册预加载脚本,实现让nodejs和Chrome之间的通信,
1
2
3
| webPreferences: {
preload:path.resolve(__dirname,'./preload.js')
}
|
用于接受来自预加载脚本的数据,而该数据来源于渲染端
1
2
| ipcMain.on('file-save',writeFile)
ipcMain.handle('file-read',readFile)
|
预加载脚本
主要实现通信,contextBridge可以将属性注册到Window,渲染端可以拿到该数据,ipcRenderer用于接受渲染端数据,将调动主进程的程序
1
2
3
4
5
6
7
8
9
10
11
12
| const {contextBridge,ipcRenderer} = require('electron')
contextBridge.exposeInMainWorld('myApi',{
name: 'jack',
saveFile: function(data){
ipcRenderer.send('file-save',data)
},
readFile: () => {
return ipcRenderer.invoke('file-read')
}
})
|
win打包配置文件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
| {
"name": "electron",
"version": "1.0.0",
"description": "A desktop application",
"main": "index.js",
"scripts": {
"start2": "nodemon --exec electron .",
"start": "electron .",
"test": "echo \"Error: no test specified\" && exit 1",
"build": "electron-builder --win --x64"
},
"build": {
"productName": "Jtest",
"appId": "com.jackasher.app",
"copyright": "© 2024 Jackasher",
"directories": {
"output": "build"
},
"win": {
"target": [
{
"target": "nsis",
"arch": [
"x64"
]
}
],
"icon": "./jack.ico"
},
"asar": true,
"nsis": {
"oneClick": false,
"allowToChangeInstallationDirectory": true,
"createDesktopShortcut": true
}
},
"keywords": [],
"author": "Jackasher",
"license": "ISC",
"devDependencies": {
"electron": "^31.2.1",
"electron-builder": "^24.13.3",
"nodemon": "^3.0.0"
},
"dependencies": {
"path": "^0.12.7"
}
}
|