public/ フォルダーには、実行時に必要な画像、アイコン、フォントなどの静的ファイルが格納されます。 これらのファイルはビルドに自動的に含まれ、開発モード中に同期され、サーバーにアップロードされます。
public/ に配置されたファイルは次のとおりです:
- 公開アクセス可能 — サーバーに同期されると、アセットはパブリック URL で配信されます。 アクセスには認証は不要です。
- フロントコンポーネントで利用可能 — アセットの URL を使用して、React コンポーネント内に画像、アイコン、その他のメディアを表示します。
- ロジック関数で利用可能 — メール、API レスポンス、その他のサーバーサイドロジックでアセットの URL を参照します。
- マーケットプレイスのメタデータに使用 —
defineApplication()のlogoUrlとscreenshotsフィールドは、このフォルダー内のファイルを参照します(例:public/logo.png)。 アプリを公開すると、これらがマーケットプレイスに表示されます。 - 開発モードで自動同期 —
public/のファイルを追加、更新、削除すると、自動的にサーバーへ同期されます。 再起動は不要です。 - ビルドに含まれる —
yarn twenty dev:buildはすべての公開アセットを配布物にバンドルします。
getPublicAssetUrl で公開アセットにアクセスする
twenty-sdk の getPublicAssetUrl ヘルパーを使用して、public/ ディレクトリ内のファイルのフル URL を取得します。 これはロジック関数とフロントコンポーネントの両方で機能します。
ロジック関数内:
src/logic-functions/send-invoice.ts
src/front-components/company-card.tsx
path 引数はアプリの public/ フォルダーからの相対パスです。 getPublicAssetUrl('logo.png') と getPublicAssetUrl('public/logo.png') のどちらも同じ URL に解決されます—public/ プレフィックスが付いている場合は自動的に取り除かれます。