mcpField
D
desktop

desktop

github.com/lobehub开发83.6k4.2k 次安装今天更新
代码仓库

关于 desktop

面向使用 Electron 开发 LobeHub 桌面功能的贡献者,介绍主进程与渲染进程架构,以及功能实现和测试步骤。

主要功能

  1. 01说明 Electron 进程架构
  2. 02介绍控制器创建与注册
  3. 03涵盖 IPC 类型定义
  4. 04说明渲染器服务和 Store 操作
  5. 05提供专项桌面开发指南

适用场景

  1. 01规划新的桌面功能
  2. 02连接主进程功能与渲染器
  3. 03添加控制器测试

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/lobehub/lobehub --skill desktop

安装后在 Claude Code 中输入/desktop确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

agents/
openai.yaml
references/
feature-implementation.md
local-tools.md
menu-config.md
window-management.md

详细介绍

桌面开发指南

架构概览

LobeHub 桌面版基于 Electron 构建,采用主进程-渲染进程架构:

  1. 主进程(apps/desktop/src/main):应用生命周期、系统 API、窗口管理
  2. 渲染进程:复用来自 src/ 的 Web 代码
  3. 预加载脚本(apps/desktop/src/preload):安全地向渲染进程公开主进程功能

添加新的桌面功能

1. 创建控制器

位置:apps/desktop/src/main/controllers/

import { ControllerModule, IpcMethod } from '@/controllers';

export default class NewFeatureCtr extends ControllerModule {
  static override readonly groupName = 'newFeature';

  @IpcMethod()
  async doSomething(params: SomeParams): Promise<SomeResult> {
    // Implementation
    return { success: true };
  }
}

在 apps/desktop/src/main/controllers/registry.ts 中注册。

2. 定义 IPC 类型

位置:packages/electron-client-ipc/src/types/<domain>.ts,并从 types/index.ts 重新导出

export interface SomeParams {
  /* ... */
}
export interface SomeResult {
  success: boolean;
  error?: string;
}
3. 创建渲染进程服务

位置:src/services/electron/

import { ensureElectronIpc } from '@/utils/electron/ipc';

const ipc = ensureElectronIpc();

export const newFeatureService = async (params: SomeParams) => {
  return ipc.newFeature.doSomething(params);
};
4. 实现 Store 操作

位置:src/store/

5. 添加测试

位置:控制器旁边,即 apps/desktop/src/main/controllers/<Name>Ctr.test.ts(source-layout §2)

详细指南

特定主题请参阅 references/:

  • 功能实现:references/feature-implementation.md
  • 本地工具工作流:references/local-tools.md
  • 菜单配置:references/menu-config.md
  • 窗口管理:references/window-management.md

评论

支持 Markdown