Verwendung von npm-Paketen
Sie können in Ihrer App beliebige npm-Pakete installieren und verwenden. Sowohl Logikfunktionen als auch Frontend-Komponenten werden mit esbuild gebündelt, das deren Abhängigkeiten in die Ausgabe einbettet — zur Laufzeit sind keinenode_modules erforderlich.
Ein Paket installieren
src/logic-functions/fetch-data.ts
src/front-components/chart.tsx
Wie das Bundling funktioniert
Der Build-Schritt verwendet esbuild, um pro Logikfunktion und pro Frontend-Komponente eine einzelne, in sich geschlossene Datei zu erzeugen. Importierte Pakete werden in das Bundle eingebettet, mit Ausnahme der unten aufgeführten. Logikfunktionen laufen in einer Node.js-Umgebung. Eingebaute Node.js-Module (fs, path, crypto, http usw.) stehen zur Verfügung und müssen nicht installiert werden.
Frontend-Komponenten laufen in einem Web Worker. Eingebaute Node.js-Module sind nicht verfügbar — nur npm-Pakete, die in einer Browserumgebung funktionieren. Beachte, dass die Sandbox nur ein teilweises DOM implementiert, sodass ein Paket sauber gebaut werden kann und trotzdem zur Laufzeit fehlschlägt; siehe Aktuelle Einschränkungen.
In beiden Umgebungen stehen twenty-client-sdk/core und twenty-client-sdk/metadata als vorab bereitgestellte Module zur Verfügung — sie werden nicht gebündelt, sondern zur Laufzeit vom Server aufgelöst.
Frontend-Komponenten können Abhängigkeiten auch über ein Bundle für gemeinsame Abhängigkeiten teilen. Pakete, die im Feld frontComponentSharedDependencies der package.json der App aufgeführt sind, werden einmal in eine separate Datei gebaut und zur Laufzeit daraus geladen, anstatt in jede Komponente eingebettet zu werden. Dadurch enthält eine Komponente, die nur gemeinsame Pakete importiert, fast keinen eigenen Abhängigkeitscode.
Einrichtung
Die erzeugte App enthält bereits Vitest. Wenn Sie es manuell einrichten, installieren Sie die Abhängigkeiten:vitest.config.ts im Stammverzeichnis Ihrer App:
vitest.config.ts
~/.twenty/config.test.json) und die App synchronisiert, bevor die Tests ausgeführt werden:
src/__tests__/global-setup.ts
Programmgesteuerte SDK-APIs
Der Subpfadtwenty-sdk/cli exportiert Funktionen, die Sie direkt aus Testcode aufrufen können:
Jede Funktion gibt ein Ergebnisobjekt mit
success: boolean und entweder data oder error zurück.
Einen Integrationstest schreiben
Hier ist ein vollständiges Beispiel, das die App baut, bereitstellt und installiert und anschließend prüft, dass sie im Arbeitsbereich erscheint:src/__tests__/app-install.integration-test.ts
Tests ausführen
Stellen Sie sicher, dass Ihr lokaler Twenty-Server läuft, und führen Sie dann Folgendes aus:Typprüfung
Sie können die Typprüfung Ihrer App auch ohne Tests ausführen:tsc --noEmit unter Verwendung der tsconfig.json Ihrer App aus und meldet etwaige Typfehler. Vom Scaffolding-Tool erzeugte Apps liefern außerdem ein yarn typecheck-Skript mit, das auch Testdateien abdeckt (tsconfig.spec.json).
CI mit GitHub Actions
Das Scaffolding-Tool erzeugt einen einsatzbereiten Workflow unter.github/workflows/ci.yml. Bei jedem Push auf main und jeder Pull-Request startet es einen kurzlebigen Twenty-Server im Runner (über die Aktion twentyhq/twenty/.github/actions/spawn-twenty-app-dev-test) und führt anschließend yarn lint, yarn typecheck, yarn test:unit und yarn test aus, wobei TWENTY_API_URL / TWENTY_API_KEY auf diesen Server verweisen. Es sind keine Geheimnisse erforderlich, und Sie können die Serverversion über die Umgebungsvariable TWENTY_VERSION oben im Workflow fixieren.
Unter Veröffentlichen → Automatisiertes CI/CD finden Sie eine vollständige Schritt-für-Schritt-Anleitung zu den drei eingerichteten Workflows (ci.yml, der cd.yml-Bereitstellungspipeline und publish.yml für die npm-Veröffentlichung).