generating-ui-bundle-features について
Salesforce UI bundle 向けの既成機能を検索・導入するワークフロースキルです。詳細確認、競合処理、サンプルファイルの統合まで案内します。
主な機能
- 01既存コードの確認
- 02機能の検索と詳細表示
- 03競合処理を伴う機能導入
- 04サンプルファイルの統合
活用シーン
- 01独自実装の前に既成機能を探す
- 02UI bundle に機能をプレビュー導入する
- 03非対話実行で導入時の競合を解決する
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ forcedotcom/ sf-skills --skill generating-ui-bundle-featuresインストール後、Claude Code で/generating-ui-bundle-featuresを入力して読み込まれたか確認します。
詳細
UI バンドルの機能
ビルド済み機能のインストール
一から作成する前に、既存の機能がないか必ず確認してください。features CLI は、基盤となる UI ライブラリ(shadcn/ui)からフルスタック機能(認証、検索、ナビゲーション、GraphQL、Agentforce AI)まで、ビルド済みでテスト済みのパッケージを Salesforce UI バンドルにインストールします。
ワークフロー
-
まずプロジェクトのコードを検索する — 何かをインストールする前に、
src/に既存の実装がないか確認します。node_modules/やdist/が一致しないよう、検索範囲はsrc/に限定してください。 -
利用可能な機能を検索する —
--search <query>を指定してnpx @salesforce/ui-bundle-features listを実行し、キーワードで絞り込みます。詳細な説明を表示するには--verboseを使います。 -
機能の詳細を確認する —
npx @salesforce/ui-bundle-features describe <feature>を実行すると、コンポーネント、依存関係、コピー操作、サンプルファイルを確認できます。 -
インストールする —
npx @salesforce/ui-bundle-features install <feature> --ui-bundle-dir <name>を実行します。主なオプションは次のとおりです。- 変更を事前に確認するには
--dry-run - 非対話モードで実行するには
--yes(競合をスキップします) - 競合を検出するには
--on-conflict errorを使い、その後--conflict-resolution <file>で解決します
- 変更を事前に確認するには
該当する機能が見つからない場合は、独自の実装を作成する前にユーザーに確認してください。関連する機能が別の名前で存在する可能性があります。
競合の処理
非対話環境では、2 段階の方法を使います。まず --on-conflict error を指定して実行し、競合を検出します。次に、解決用の JSON ファイル({ "path": "skip" | "overwrite" })を作成し、--conflict-resolution を指定して再実行します。
インストール後:サンプルファイルの統合
機能には、統合パターンを示す __example__ ファイルが含まれる場合があります。それぞれについて、次の手順を行います。
- サンプルファイルを読み、パターンを理解します
- 対象ファイル(
describeの出力に表示されます)を読みます - サンプルのパターンを対象ファイルに適用します
- 統合が正常に完了したら、サンプルファイルを削除します
ヒントのプレースホルダー
一部のコピー先パスでは、CLI が解決しない <descriptive-name> 形式のプレースホルダー(例:<desired-page-with-search-input>)が使われています。インストール後、これらのファイル名を変更するか、目的の場所に移動するか、既存ファイルにそのパターンを統合してください。