- Update tool count from 29 to 75 across all docs and locales - Expand all locale pages (de/es/fr/it/pl) to full translations - Add missing German sections: Advanced Rendering, Z-Order, ScrubInput, CI/CD, JSX Renderer, Code Panel, full figma-comparison matrix - Write complete figma-comparison (152-row matrix) for all locales - Expand comparison, features, tech-stack, contributing for es/fr/it/pl - Fix garbled text in locale mcp-tools reference pages - Architecture diagrams use '75+ tools' to avoid staleness
3.7 KiB
3.7 KiB
Mitwirken
Projektstruktur
packages/
core/ @open-pencil/core — Engine (keine DOM-Abhängigkeiten)
src/ Szenengraph, Renderer, Layout, Codec, Kiwi, Typen
cli/ @open-pencil/cli — Headless-CLI für .fig-Operationen
src/commands/ info, tree, find, export, eval, analyze
mcp/ @open-pencil/mcp — MCP-Server für KI-Werkzeuge
src/ stdio + HTTP (Hono) Transporte, 75 Werkzeuge
src/
components/ Vue SFCs (Canvas, Panels, Werkzeugleiste, Farbauswahl)
properties/ Eigenschaftspanel-Abschnitte
composables/ Canvas-Input, Tastenkürzel, Rendering-Hooks
stores/ Editor-Zustand (Vue-Reaktivität)
engine/ Re-Export-Shims von @open-pencil/core
desktop/ Tauri v2 (Rust + Konfiguration)
tests/
e2e/ Playwright visuelle Regression
engine/ Unit-Tests (bun:test)
packages/docs/ VitePress-Dokumentationsseite
openspec/
specs/ Fähigkeitsspezifikationen (Wahrheitsquelle)
changes/ Aktive und archivierte Änderungen
Entwicklungsumgebung
bun install
bun run dev # Editor auf localhost:1420
bun run docs:dev # Dokumentation auf localhost:5173
Code-Stil
Werkzeuge
| Werkzeug | Befehl | Zweck |
|---|---|---|
| oxlint | bun run lint |
Linting (Rust-basiert, schnell) |
| oxfmt | bun run format |
Code-Formatierung |
| tsgo | bun run typecheck |
Typprüfung (Go-basierter TypeScript-Prüfer) |
Alle Prüfungen ausführen:
bun run check
Konventionen
- Dateinamen — kebab-case (
scene-graph.ts,use-canvas-input.ts) - Komponenten — PascalCase Vue SFCs (
EditorCanvas.vue,ScrubInput.vue) - Konstanten — SCREAMING_SNAKE_CASE
- Funktionen/Variablen — camelCase
- Typen/Interfaces — PascalCase
KI-Agent-Konventionen
Entwickler und KI-Agenten sollten AGENTS.md im Repo-Root lesen (auf GitHub ansehen). Behandelt Rendering, Szenengraph, Komponenten & Instanzen, Layout, UI, Dateiformat, Tauri-Konventionen und bekannte Probleme.
Änderungen vornehmen
- Vorhandene OpenSpec-Spezifikationen für die zu ändernde Fähigkeit prüfen
- Bei neuem Verhalten eine OpenSpec-Änderung erstellen:
openspec new change "meine-aenderung" - Änderung implementieren
bun run checkundbun run testausführen- Pull Request einreichen
Schlüsseldateien
Engine-Quellcode lebt in packages/core/src/. Die src/engine/- und src/kiwi/-Dateien der App sind Re-Export-Shims — bearbeiten Sie das Core-Paket, nicht die Shims.
| Datei | Zweck |
|---|---|
packages/core/src/scene-graph.ts |
Szenengraph: Knoten, Variablen, Instanzen, Hit-Testing |
packages/core/src/renderer.ts |
CanvasKit-Rendering-Pipeline |
packages/core/src/layout.ts |
Yoga-Layout-Adapter |
packages/core/src/undo.ts |
Rückgängig/Wiederherstellen-Manager |
packages/core/src/clipboard.ts |
Figma-kompatible Zwischenablage |
packages/core/src/vector.ts |
Vektornetzwerk-Modell |
packages/core/src/kiwi/codec.ts |
Kiwi-Binär-Encoder/Decoder |
packages/core/src/kiwi/fig-import.ts |
.fig-Datei-Import-Logik |
packages/core/src/tools/schema.ts |
Vereinheitlichte Werkzeugdefinitionen (KI, MCP, CLI) |
packages/core/src/figma-api.ts |
Figma Plugin API-Implementierung |
packages/mcp/src/server.ts |
MCP-Server-Factory |
packages/cli/src/index.ts |
CLI-Einstiegspunkt |
src/stores/editor.ts |
Globaler Editor-Zustand |
src/composables/use-canvas.ts |
Canvas-Rendering-Composable |
src/composables/use-keyboard.ts |
Tastenkürzel-Behandlung |