文章目录
接到一个任务，将electron集成到solidworks中，所以记录一下electron的简单操作，我是基于官网的教程写的，如有不对，欢迎指正
1.参考网站
https://www.electronjs.org/zh/docs/latest/tutorial/quick-start
2.HelloWold编写
2.1新建空文件夹
2.2node初始化
输入
node init，填写node信息
2.3安装electron依赖
npm 太慢了，淘宝镜像依然能用
cnpm install electron --save-dev
2.4添加.gitignore 文件
不要添加就行，git先不用
2.5创建main.js文件和index.html
记得看一下
package.json中的信息
创建
main.js文件
const { app, BrowserWindow } = require('electron')
const createWindow = () => {
const win = new BrowserWindow({
width: 800,
height: 600
})
win.loadFile('./index.html')
}
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') app.quit()
})
app.whenReady().then(() => {
createWindow()
})
创建index.html文件
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
<title>你好!</title>
</head>
<body>
<h1>你好!</h1>
我们正在使用 Node.js <span id="node-version"></span>,
Chromium <span id="chrome-version"></span>,
和 Electron <span id="electron-version"></span>.
<script src="./renderer.js"></script>
</body>
</html>
2.6运行electron应用
在package.json中添加script，如果是helloword输出成功了，那就完活了
出现如下界面，完活!
3.打包
下载forge
npm install -g --save-dev @electron-forge/cli
打包
npx electron-forge import
这时候发现程序一直卡到这边（多实验几次）
4.框架
我这边推荐electron-admin-template脚手架，一个词，丰富，但是由于框架的使用的electron版本比较低，所以内置的nodejs版本比较低，如有特殊需要，可以升级electron，但是注意与框架的兼容性
5.主线程和渲染线程之间进行通信
5.1响应式
渲染线程采用
invoke方法，等待主线程进行通信,注意：invoke方法只能用handle监听，这里只提供渲染线程->主线程,主线程->渲染线程尚未提供
ipcRenderer.invoke('getCurrentFileInfoRequ').then(resp => {
console.log(resp)
})
ipcMain.handle('getCurrentFileInfoRequ', async () => {
return '1111'
})
5.2异步发送
5.2.1主线程->渲染线程
ipcMain.webContents.send(通道名, true);
ipcRenderer.on(通道, （event, ...args) => {
})
5.2.2渲染线程->主线程
ipcRenderer.send(通道名, true);
ipcMain.on(通道, （event, ...args) => {
})
6.electron-vue
6.1使用electron-builder，如何设置设置用户可选择安装目录
设置如下两项：
2677
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
