Electron任务栏右键设置教程详解

最近发现不少小伙伴都对文章很感兴趣，所以今天继续给大家介绍文章相关的知识，本文《Electron任务栏右键菜单设置教程》主要内容涉及到等等知识点，希望能帮到你！当然如果阅读本文时存在不同想法，可以在评论中表达，但是请勿使用过激的措辞~

理解任务栏右键菜单的默认行为

当您在开发 Electron 应用程序时，如果在 Windows 任务栏上右键单击应用程序图标，可能会看到一个名为“Electron”的选项，点击后会打开一个空的 Electron 窗口，而不是您的应用程序实例。这常常被误解为“Electron 主页”。

实际上，您所看到的是 Windows 操作系统任务栏 JumpList 的一个默认行为。当应用程序未被打包成独立可执行文件时，系统识别到的是 electron.exe 这个进程。因此，JumpList 中默认的“打开新窗口”选项会尝试启动一个新的 electron.exe 实例，但由于没有指定主脚本，它便表现为一个空的 Electron 容器。这个默认的“打开新窗口”功能是 Windows 系统层面的行为，针对任何应用程序都存在，且无法直接修改或移除。

为了验证这一点，您可以在项目根目录下直接运行 node_modules/electron/dist/electron.exe 或 npm run electron（不带任何参数），您会观察到同样的结果：一个空的 Electron 窗口。

核心解决方案：打包您的 Electron 应用程序

解决上述问题的关键在于将您的 Electron 应用程序打包成一个独立的、可分发的执行文件。在开发模式下，您运行的是 Electron 运行时环境来加载您的代码；而打包过程则是将 Electron 运行时、您的应用程序代码以及所有依赖项封装在一起，形成一个独立的应用程序。

当您的应用程序被打包后，系统将识别到的是您应用程序的专属可执行文件（例如 YourAppName.exe），而不是通用的 electron.exe。此时，任务栏 JumpList 中的默认“打开新窗口”选项将正确地启动一个新的您的应用程序实例。

推荐的打包工具：

• Electron Forge: 一个功能全面的工具，提供了从初始化项目到打包和发布的完整工作流。
• Electron Builder: 另一个流行且功能强大的打包工具，支持多种平台和灵活的配置。

使用这些工具进行打包后，您会发现任务栏右键菜单中的默认选项将显示为您的应用程序名称，并且点击后会正常启动一个新的应用程序窗口。

配置应用程序名称 (productName)

打包工具通常会根据您 package.json 文件中的配置来生成可执行文件的名称以及 JumpList 中显示的应用程序名称。其中，productName 属性尤为重要。

通过在 package.json 中设置 productName，您可以自定义打包后应用程序的显示名称。例如：

{
  "name": "my-fancy-app",
  "version": "1.0.0",
  "productName": "我的炫酷应用"
}

在上述配置中，"productName": "我的炫酷应用" 将确保打包后的可执行文件（例如 我的炫酷应用.exe）以及任务栏 JumpList 中的默认条目都显示为“我的炫酷应用”。

扩展：自定义 JumpList 条目

虽然默认的“打开新窗口”选项是固定的，但 Electron 提供了 API 允许您为应用程序添加自定义的 JumpList 条目。这些自定义条目可以包含特定的任务（例如“新建文件”、“打开最近文档”）或指向特定的文件。

您可以使用 Electron 的 app.setJumpList() API 来创建和管理这些自定义条目。这使得您的应用程序能够提供更丰富的用户交互体验。

示例（概念性代码，非完整实现）：

const { app } = require('electron');

app.whenReady().then(() => {
  if (process.platform === 'win32') {
    app.setJumpList([
      {
        type: 'task',
        title: '打开最近文件',
        description: '打开上次编辑的文件',
        program: process.execPath,
        args: '--open-recent',
        iconPath: process.execPath,
        iconIndex: 0
      },
      {
        type: 'task',
        title: '新建文档',
        description: '创建一个新的空白文档',
        program: process.execPath,
        args: '--new-document',
        iconPath: 'path/to/your/icon.ico', // 可以是自定义图标
        iconIndex: 0
      },
      {
        type: 'separator'
      },
      {
        type: 'file',
        path: 'C:\\Users\\YourUser\\Documents\\my-project.txt' // 可以指向特定文件
      }
    ]);
  }
});

更多关于如何使用 app.setJumpList() 的详细信息和示例，建议查阅 Electron 官方文档中关于 Windows 任务栏的教程。

总结与注意事项

• 核心问题并非“Electron 主页”： 任务栏右键菜单中看到的“Electron”选项是未打包应用运行时 electron.exe 的默认行为。
• 解决方案是打包： 使用 Electron Forge 或 Electron Builder 等工具将您的应用程序打包成独立的可执行文件是解决此问题的关键。
• 配置 productName： 在 package.json 中设置 productName 属性，以确保打包后的应用程序名称和 JumpList 条目正确显示。
• 默认选项不可更改： 任务栏 JumpList 中默认的“打开新窗口”功能是系统行为，无法直接移除或修改其启动逻辑。
• 自定义 JumpList： 您可以通过 app.setJumpList() API 添加额外的自定义任务和目的地，以增强用户体验。

通过理解这些基本概念并正确地打包您的 Electron 应用程序，您将能够为用户提供一个专业且功能完善的桌面应用体验。

以上就是本文的全部内容了，是否有顺利帮助你解决问题？若是能给你带来学习上的帮助，请大家多多支持golang学习网！更多关于文章的相关知识，也可关注golang学习网公众号。