Публичные ресурсы (папка public/)
Папка public/ в корне вашего приложения содержит статические файлы — изображения, значки, шрифты и любые другие ресурсы, необходимые вашему приложению во время выполнения. Эти файлы автоматически включаются в сборки, синхронизируются в режиме разработки и загружаются на сервер.
Файлы, размещённые в public/, являются:
- Публично доступными — после синхронизации с сервером ресурсы доступны по публичному URL. Для доступа к ним аутентификация не требуется.
- Доступными в компонентах фронтенда — используйте URL ресурсов для отображения изображений, значков или любого медиа внутри ваших компонентов React.
- Доступными в логических функциях — используйте URL ресурсов в письмах, ответах API или любой серверной логике.
- Используются для метаданных маркетплейса — поля
logoUrlиscreenshotsвdefineApplication()ссылаются на файлы из этой папки (например,public/logo.png). Они отображаются в маркетплейсе при публикации вашего приложения. - Автосинхронизация в режиме разработки — когда вы добавляете, обновляете или удаляете файл в
public/, он автоматически синхронизируется с сервером. Перезапуск не требуется. - Включены в сборки —
yarn twenty buildупаковывает все публичные ресурсы в выходной дистрибутив.
Доступ к публичным ресурсам с помощью getPublicAssetUrl
Используйте хелпер getPublicAssetUrl из twenty-sdk, чтобы получить полный URL файла в каталоге public/ вашего приложения. Он работает как в логических функциях, так и в компонентах фронтенда.
В логической функции:
src/logic-functions/send-invoice.ts
src/front-components/company-card.tsx
path задаётся относительно папки public/ вашего приложения. И getPublicAssetUrl('logo.png'), и getPublicAssetUrl('public/logo.png') приводят к одному и тому же URL — префикс public/, если он есть, удаляется автоматически.
Использование пакетов npm
Вы можете устанавливать и использовать любые пакеты npm в своём приложении. И логические функции, и компоненты фронтенда собираются с помощью esbuild, который встраивает все зависимости в выходной файл — каталогиnode_modules во время выполнения не нужны.
Установка пакета
src/logic-functions/fetch-data.ts
src/front-components/chart.tsx
Как работает бандлинг
Этап сборки использует esbuild для создания одного самодостаточного файла на каждую логическую функцию и на каждый компонент фронтенда. Все импортированные пакеты встроены в бандл. Логические функции выполняются в среде Node.js. Встроенные модули Node (fs, path, crypto, http и т. д.) доступны и не требуют установки.
Компоненты фронтенда выполняются в Web Worker. Встроенные модули Node недоступны — доступны только браузерные API и пакеты npm, работающие в браузерной среде.
В обеих средах доступны как предварительно предоставленные модули twenty-client-sdk/core и twenty-client-sdk/metadata — они не включаются в бандл, а подставляются сервером во время выполнения.
Тестирование вашего приложения
SDK предоставляет программные API, которые позволяют собирать, разворачивать, устанавливать и удалять ваше приложение из тестового кода. В сочетании с Vitest и типизированными клиентами API вы можете писать интеграционные тесты, которые проверяют, что ваше приложение работает сквозным образом на реальном сервере Twenty.Настройка
Приложение, созданное скэффолдером, уже включает Vitest. Если вы настраиваете его вручную, установите зависимости:vitest.config.ts в корне вашего приложения:
vitest.config.ts
src/__tests__/setup-test.ts
Программные API SDK
Подпутьtwenty-sdk/cli экспортирует функции, которые можно вызывать напрямую из тестового кода:
| Функция | Описание |
|---|---|
appBuild | Собрать приложение и при необходимости упаковать tar-архив |
appDeploy | Загрузить tar-архив на сервер |
appInstall | Установить приложение в активное рабочее пространство |
appUninstall | Удалить приложение из активного рабочего пространства |
success: boolean и либо data, либо error.
Написание интеграционного теста
Полный пример, который собирает, разворачивает и устанавливает приложение, а затем проверяет, что оно появляется в рабочем пространстве:src/__tests__/app-install.integration-test.ts
Запуск тестов
Убедитесь, что ваш локальный сервер Twenty запущен, затем:Проверка типов
Вы также можете запустить проверку типов для своего приложения без запуска тестов:tsc --noEmit и сообщает о любых ошибках типов.
Справочник по CLI
Помимоdev, build, add и typecheck, CLI предоставляет команды для выполнения функций, просмотра логов и управления установками приложений.
Выполнение функций (yarn twenty exec)
Запустите логическую функцию вручную, не вызывая её через HTTP, cron или событие базы данных:
Просмотр логов функций (yarn twenty logs)
Потоковая передача журналов выполнения логических функций вашего приложения:
Это отличается от
yarn twenty server logs, который показывает логи контейнера Docker. yarn twenty logs показывает журналы выполнения функций вашего приложения с сервера Twenty.Удаление приложения (yarn twenty uninstall)
Удалите свое приложение из активного рабочего пространства:
Управление удалёнными серверами
Remote — это сервер Twenty, к которому подключается ваше приложение. Во время настройки скэффолдер автоматически создаст его для вас. Вы можете в любой момент добавлять новые удалённые серверы или переключаться между ними.~/.twenty/config.json.
CI с GitHub Actions
Скэффолдер генерирует готовый к использованию рабочий процесс GitHub Actions в.github/workflows/ci.yml. Он автоматически запускает ваши интеграционные тесты при каждом пуше в main и в pull request’ах.
Рабочий процесс:
- Извлекает ваш код
- Поднимает временный сервер Twenty с помощью экшена
twentyhq/twenty/.github/actions/spawn-twenty-docker-image - Устанавливает зависимости с помощью
yarn install --immutable - Запускает
yarn testсTWENTY_API_URLиTWENTY_API_KEY, переданными из выходных данных экшена
.github/workflows/ci.yml
spawn-twenty-docker-image запускает эфемерный сервер Twenty прямо в раннере и выводит данные для подключения. Секрет GITHUB_TOKEN предоставляется GitHub автоматически.
Чтобы закрепить конкретную версию Twenty вместо latest, измените переменную окружения TWENTY_VERSION в начале рабочего процесса.