electron踩坑记录
[TOC]
文档
- electron官方文档：
https://electronjs.org/docs - github地址：
https://github.com/SimulatedGREG/vue-electron - electron-vue:
https://simulatedgreg.gitbooks.io/electron-vue/content/cn/ - Electron中BrowserWindow对象的所有可设置项：
https://www.jianshu.com/p/0387bd0f8a70?utm_campaign=maleskine&utm_content=note&utm_medium=seo_notes&utm_source=recommendation
创建项目
- 创建命令：
vue init simulatedgreg/electron-vue - 文档：
https://www.jianshu.com/p/7f64daa9264c
Electron如何隐藏窗体的菜单栏
要创建无边框窗口，只需在src/main/index.js中的BrowserWindow的options中将frame设置为 false
自定义区域拖拽
.titlebar {
-webkit-user-select: none;
-webkit-app-region: drag;
}
- 参考文档：
https://blog.csdn.net/fukaiit/article/details/91351448
自定义最大最小关闭窗口功能
方法一 通信
在index.js中
import { ipcMain } from 'electron'
ipcMain.on('min', e => mainWindow.minimize()) // 最小化窗口
ipcMain.on('max', e => mainWindow.maximize()) // 窗口最大化
ipcMain.on('close', e => mainWindow.close()) // 关闭窗口
ipcMain.on('resetWindow', e => mainWindow.unmaximize()) // 还原窗口
// 使用方式
const { ipcRenderer } = require('electron')
ipcRenderer.send('min')
方法二
const electron = require('electron')
const remote = electron.remote
remote.getCurrentWindow().maximize() // 最大化
监听窗口变化
- underscore文档:
https://underscorejs.org/ - 判断窗口是否最大化:
remote.getCurrentWindow().isMaximized()
// 使用依赖 underscore.js
const _ = require('underscore')
let currentWindow = remote.getCurrentWindow().removeAllListeners()
// 设置100毫秒内只触发一次
currentWindow.on('resize', _.debounce(() => {
}, 100))
编译问题
npm run build失败 下载依赖超时 403
- 加速国内github访问：
https://blog.csdn.net/w958660278/article/details/81161224 - 修改本机的hosts文件 增加以下内容
192.30.253.112 github.com
185.199.108.153 assets-cdn.github.com
151.101.185.194 github.global.ssl.fastly.net
- 记得重启cmd
链接数据库 sqlite3
已解决 请查看另一篇文章
