experience-ui-bundle-features-generate
GitHub当项目包含uiBundles目录且需添加认证或搜索功能时激活。通过CLI安装预构建的认证(登录/会话)和搜索组件,避免重复开发。流程包括搜索现有代码、列出/描述/安装特性及处理冲突与示例集成。
Trigger Scenarios
Install
npx skills add forcedotcom/sf-skills --skill experience-ui-bundle-features-generate -g -y
SKILL.md
Frontmatter
{
"name": "experience-ui-bundle-features-generate",
"metadata": {
"version": "1.0"
},
"description": "MUST activate when the project contains a uiBundles\/*\/src\/ directory and the user wants to add authentication or search to their app. Use this skill when adding authentication or search to a UI bundle app. Only covers two features: authentication (login, logout, protected routes, session management) and search (global search across pages and content). Always use this skill for these two features instead of building from scratch."
}
UI Bundle Features
Installing Pre-built Features
Always check for an existing feature before building something from scratch. The features CLI installs pre-built, tested packages into Salesforce UI bundles — from foundational UI libraries (shadcn/ui) to full-stack capabilities (authentication, search, navigation, GraphQL, Agentforce AI).
Workflow
-
Search project code first — check
src/for existing implementations before installing anything. Scope searches tosrc/to avoid matchingnode_modules/ordist/. -
Search available features — use
npx @salesforce/ui-bundle-features listwith--search <query>to filter by keyword. Use--verbosefor full descriptions. -
Describe a feature — use
npx @salesforce/ui-bundle-features describe <feature>to see components, dependencies, copy operations, and example files. -
Install — use
npx @salesforce/ui-bundle-features install <feature> --ui-bundle-dir <name>. Key options:--dry-runto preview changes--yesfor non-interactive mode (skips conflicts)--on-conflict errorto detect conflicts, then--conflict-resolution <file>to resolve them
If no matching feature is found, ask the user before building a custom implementation — a relevant feature may exist under a different name.
Conflict Handling
In non-interactive environments, use the two-pass approach: first run with --on-conflict error to detect conflicts, then create a resolution JSON file ({ "path": "skip" | "overwrite" }) and re-run with --conflict-resolution.
Post-install: Integrating Example Files
Features may include __example__ files showing integration patterns. For each:
- Read the example file to understand the pattern
- Read the target file (shown in
describeoutput) - Apply the pattern from the example into the target
- Delete the example file after successful integration
Hint Placeholders
Some copy paths use <descriptive-name> placeholders (e.g., <desired-page-with-search-input>) that the CLI does not resolve. After installation, rename or relocate these files to the intended target, or integrate their patterns into an existing file.
Version History
- 1.29.0 Current 2026-07-05 18:49


