xiaohei
428644e286
Revalidate Docs / Revalidate Docs (push) Failing after 2s
E2E CI / Check Duplicate Run (push) Failing after 5s
Test CI / Check Duplicate Run (push) Failing after 6s
E2E CI / Test Web App (push) Has been skipped
Test CI / Test Packages (push) Has been skipped
Test CI / Test App (shard 1/3) (push) Has been skipped
Test CI / Test App (shard 2/3) (push) Has been skipped
Test CI / Test App (shard 3/3) (push) Has been skipped
Test CI / Test Desktop App (push) Has been skipped
🔄 Branch Synchronization / sync-branches (push) Failing after 11s
Test CI / Test Database (push) Has been skipped
Test CI / Merge and Upload App Coverage (push) Has been skipped
Database Schema Visualization CI / build (push) Failing after 4m14s
90 lines
2.4 KiB
Markdown
90 lines
2.4 KiB
Markdown
---
|
|
name: desktop
|
|
description: Electron desktop development guide. Use when implementing desktop features, IPC handlers, controllers, preload scripts, window management, menu configuration, or Electron-specific functionality. Triggers on desktop app development, Electron IPC, or desktop local tools implementation.
|
|
disable-model-invocation: true
|
|
---
|
|
|
|
# Desktop Development Guide
|
|
|
|
## Architecture Overview
|
|
|
|
LobeHub desktop is built on Electron with main-renderer architecture:
|
|
|
|
1. **Main Process** (`apps/desktop/src/main`): App lifecycle, system APIs, window management
|
|
2. **Renderer Process**: Reuses web code from `src/`
|
|
3. **Preload Scripts** (`apps/desktop/src/preload`): Securely expose main process to renderer
|
|
|
|
## Adding New Desktop Features
|
|
|
|
### 1. Create Controller
|
|
|
|
Location: `apps/desktop/src/main/controllers/`
|
|
|
|
```typescript
|
|
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 };
|
|
}
|
|
}
|
|
```
|
|
|
|
Register in `apps/desktop/src/main/controllers/registry.ts`.
|
|
|
|
### 2. Define IPC Types
|
|
|
|
Location: `packages/electron-client-ipc/src/types.ts`
|
|
|
|
```typescript
|
|
export interface SomeParams {
|
|
/* ... */
|
|
}
|
|
export interface SomeResult {
|
|
success: boolean;
|
|
error?: string;
|
|
}
|
|
```
|
|
|
|
### 3. Create Renderer Service
|
|
|
|
Location: `src/services/electron/`
|
|
|
|
```typescript
|
|
import { ensureElectronIpc } from '@/utils/electron/ipc';
|
|
|
|
const ipc = ensureElectronIpc();
|
|
|
|
export const newFeatureService = async (params: SomeParams) => {
|
|
return ipc.newFeature.doSomething(params);
|
|
};
|
|
```
|
|
|
|
### 4. Implement Store Action
|
|
|
|
Location: `src/store/`
|
|
|
|
### 5. Add Tests
|
|
|
|
Location: `apps/desktop/src/main/controllers/__tests__/`
|
|
|
|
## Detailed Guides
|
|
|
|
See `references/` for specific topics:
|
|
|
|
- **Feature implementation**: `references/feature-implementation.md`
|
|
- **Local tools workflow**: `references/local-tools.md`
|
|
- **Menu configuration**: `references/menu-config.md`
|
|
- **Window management**: `references/window-management.md`
|
|
|
|
## Best Practices
|
|
|
|
1. **Security**: Validate inputs, limit exposed APIs
|
|
2. **Performance**: Use async methods, batch data transfers
|
|
3. **UX**: Add progress indicators, provide error feedback
|
|
4. **Code organization**: Follow existing patterns, add documentation
|