ebee7d71b9
Created by Github action <!-- This is an auto-generated description by cubic. --> <a href="https://cubic.dev/pr/twentyhq/twenty/pull/22715?utm_source=github" target="_blank" rel="noopener noreferrer" data-no-image-dialog="true"><picture><source media="(prefers-color-scheme: dark)" srcset="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"><source media="(prefers-color-scheme: light)" srcset="https://www.cubic.dev/buttons/review-in-cubic-light.svg"><img alt="Review in cubic" src="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"></picture></a> <!-- End of auto-generated description by cubic. --> Co-authored-by: github-actions <github-actions@twenty.com>
78 lines
5.4 KiB
Plaintext
78 lines
5.4 KiB
Plaintext
---
|
||
title: Projektstruktur
|
||
description: Was in einer generierten Twenty-App enthalten ist – Dateien, Ordner und was jede einzelne davon macht.
|
||
icon: folder-tree
|
||
---
|
||
|
||
Eine neue App, die mit `npx create-twenty-app` generiert wurde, sieht so aus:
|
||
|
||
```text filename="my-twenty-app/"
|
||
my-twenty-app/
|
||
package.json
|
||
src/
|
||
application-config.ts # Required — your app's entry point
|
||
default-role.ts # Permissions for logic functions
|
||
constants/
|
||
universal-identifiers.ts # Auto-generated UUIDs and metadata
|
||
front-components/
|
||
main-page.tsx # Welcome page component
|
||
navigation-menu-items/
|
||
main-page.navigation-menu-item.ts # Sidebar entry for the welcome page
|
||
page-layouts/
|
||
main-page.page-layout.ts # Standalone page hosting the component
|
||
__tests__/
|
||
application-config.test.ts # Unit test
|
||
global-setup.ts # Integration test setup (sync + uninstall)
|
||
schema.integration-test.ts # Integration test against a live server
|
||
.github/workflows/
|
||
ci.yml # Lint, typecheck, unit + integration tests
|
||
cd.yml # Deploy + install on push to main
|
||
public/
|
||
logo.svg # Static assets
|
||
vitest.config.ts # Integration test runner config
|
||
vitest.unit.config.ts # Unit test runner config
|
||
tsconfig.json, tsconfig.spec.json
|
||
.nvmrc, .yarnrc.yml, .oxlintrc.json
|
||
README.md, AGENTS.md, CLAUDE.md
|
||
```
|
||
|
||
## Wichtige Dateien
|
||
|
||
| Datei / Ordner | Zweck |
|
||
| -------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ |
|
||
| `src/application-config.ts` | **Erforderlich.** Die Hauptkonfigurationsdatei für Ihre App. |
|
||
| `src/default-role.ts` | Standardrolle, die steuert, worauf Ihre Logikfunktionen zugreifen können. |
|
||
| `src/constants/universal-identifiers.ts` | Automatisch erzeugte UUIDs und Metadaten (Anzeigename, Beschreibung). |
|
||
| `src/front-components/`, `src/navigation-menu-items/`, `src/page-layouts/` | Eine Willkommens-Startseite: eine Front-Komponente, die von einem eigenständigen Seitenlayout gerendert wird und über die Seitenleiste erreichbar ist. |
|
||
| `src/__tests__/` | Ein Komponententest plus ein Integrationstest (mit seinem globalen Setup), der die App mit einem echten Server synchronisiert. |
|
||
| `public/` | Statische Assets (Bilder, Schriftarten), die mit Ihrer App ausgeliefert werden. |
|
||
| `AGENTS.md` / `CLAUDE.md` | Anleitung für KI-Coding-Agents, die an der App arbeiten. |
|
||
|
||
<Note>
|
||
**Die Dateiorganisation liegt bei Ihnen.** Die oben genannten Ordner sind Konventionen – das SDK erkennt Entitäten über eine AST-Analyse von `export default defineEntity(...)`-Aufrufen, unabhängig davon, wo sich die Datei befindet.
|
||
</Note>
|
||
|
||
## Abhängigkeiten
|
||
|
||
Beide Twenty-SDK-Pakete gehören unter `devDependencies`, nicht unter `dependencies`:
|
||
|
||
```json filename="package.json"
|
||
{
|
||
"dependencies": {},
|
||
"devDependencies": {
|
||
"twenty-client-sdk": "2.20.0",
|
||
"twenty-sdk": "2.20.0",
|
||
"twenty-ui": "1.0.0-alpha.1"
|
||
}
|
||
}
|
||
```
|
||
|
||
Das Scaffolding-Tool fixiert `twenty-sdk` und `twenty-client-sdk` auf seine eigene Version – halte beide beim Aktualisieren synchron.
|
||
|
||
* **`twenty-sdk`** stellt die `twenty`-CLI sowie die Build-/Scaffolding-Tools bereit. Es läuft nur während der Entwicklung und beim Build und wird zur Laufzeit der veröffentlichten App niemals importiert.
|
||
* **`twenty-client-sdk`** *wird* hingegen von deinem App-Code importiert (`CoreApiClient`, `MetadataApiClient`, `RestApiClient`), aber Twenty stellt es zur Laufzeit bereit – Logikfunktionen beziehen es aus einer generierten SDK-Schicht, und Frontend-Komponenten lösen es aus serverseitig ausgelieferten Modulen auf. Deine installierte Kopie wird nur für die Typprüfung und den Build zum Zeitpunkt des Deployments verwendet, daher muss sie niemals im ausgelieferten Bundle enthalten sein.
|
||
|
||
Wenn eines der Pakete unter `dependencies` bleibt, wird es in das Runtime-Bundle der installierten App gezogen, wo es nur Ballast ist. `twenty dev:build` gibt eine Warnung aus, wenn eines von beiden weiterhin unter `dependencies` aufgeführt ist.
|
||
|
||
Füge die eigenen Runtime-Abhängigkeiten deiner App (Bibliotheken, die deine Logikfunktionen zur Laufzeit tatsächlich importieren) wie gewohnt unter `dependencies` hinzu.
|