Electron简介

Electron是一个开源的跨平台桌面应用程序开发框架，允许开发者使用前端 Web 技术（HTML、CSS 和 JavaScript）来构建桌面应用程序。

Electron结构

Electron：App

生命周期

• ready

  • 触发时机：当 Electron 初始化完成并且应用程序准备好创建浏览器窗口时。
  • 用途：初始化界面和一些基本配置

  • app.on('ready', () => {
    createWindow()
    })

• certificate-error

  • 触发时机：当在加载网页时发生证书错误时。
  • 用途：可以在这个事件中拦截证书错误并决定是否继续加载页面。

    • 示例：在证书错误时阻止默认行为并返回 true 以继续加载页面。

  • app.on('certificate-error', (event, webContents, url, error, certificate, callback) => {
    event.preventDefault()
    callback(true)
    })

• before-quit

  • 触发时机：当用户尝试退出应用程序时，通常是通过关闭所有窗口或者点击关闭按钮。
  • 用途：在应用程序退出之前执行一些保存提示操作。

    • 示例：记事本退出时提示是否保存

  • app.on('before-quit', () => {
    console.log('app before-quit')
    })

• window-all-closed

  • 触发时机：所有应用程序窗口都被关闭时。
  • 用途：在应用程序完全退出之前保留某些功能。

    • 示例：macOS中保留菜单栏。

  • 
    app.on('window-all-closed', function () {
    console.log('window-all-closed')
    })

• activate

  • 触发时机：在点击 Dock 图标（macOS）或者任务栏图标（Windows）时。
  • 用途：用于在所有窗口都已关闭的情况下，重新创建主窗口。

    • 示例：在 macOS 中，点击 Dock 图标时重新创建主窗口。

  • app.on('activate', function () {
    console.log('activate')
    })

• quit

  • 触发时机：当应用程序被终止时。
  • 用途：在应用程序完全退出之前执行一些清理操作。

    • 示例：关闭数据库连接。

  • app.on('quit', function () {
    console.log('quit')
    getTray() && getTray().destroy()
    })

• will-quit

  • 触发时机：当应用程序即将退出时（在quit事件之前）。
  • 用途：在应用程序即将退出之前执行一些清理操作。

  • app.on('will-quit', function () {
    console.log('will-quit')
    })

• will-finish-launching

  • 触发时机：应用程序启动过程开始时。
  • 用途：在应用程序启动过程中执行一些初始化操作。

  • app.on('will-finish-launching', function () {
    console.log('will-finish-launching')
    })

文章还在施工中，过段时间再来看看吧^_^

引用

• Electron - 应用开发接口（API）
• 前端必学的桌面开发：Electron+React开发桌面应用（1W多字超详细）