skills.rest
padjei
padjeiCOMMUNITY
Explore all skills by this author →
GitHub

experience-ui-bundle-metadata-generate

Scaffolds Salesforce UI bundles and configures ui-bundle.json, meta XML, and CSP Trusted Sites.

Updated Jul 2, 2026
Search Tags:#react#scaffolding#metadata#salesforce#ui bundle#csp trusted sites#experience cloud
One-click install
npx skills add https://github.com/padjei/SF_Build --skill experience-ui-bundle-metadata-generate-padjei
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: experience-ui-bundle-metadata-generate
Source: https://github.com/padjei/SF_Build/tree/main/.claude/skills/experience-ui-bundle-metadata-generate
Command: npx skills add https://github.com/padjei/SF_Build --skill experience-ui-bundle-metadata-generate-padjei

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Setting up a Salesforce UI bundle involves strict metadata rules — the .uibundle-meta.xml must match its folder name, a hosting target is required for the app to appear in the org, ui-bundle.json has rigid validation constraints, and every external domain must be registered as a CSP Trusted Site or resources get blocked. This Skill encodes all of those rules so nothing is missed. ## Core Features & Use Cases - UI Bundle Scaffolding: Generates new React-based UI bundles with sf template generate ui-bundle --template reactbasic, enforcing alphanumeric naming and post-generation content replacement. - Metadata Configuration: Produces valid .uibundle-meta.xml files with required fields (masterLabel, version, isActive, target) and validates ui-bundle.json routing, headers, and outputDir against path-safety rules. - CSP Trusted Site Registration: Maps external domains to the correct CSP directives (img-src, connect-src, font-src, etc.) and generates compliant .cspTrustedSite-meta.xml files. - Use Case: You scaffold a property rental app, configure it with an Experience target, and register Unsplash and OpenStreetMap as CSP Trusted Sites so images and map tiles load without browser CSP violations. ## Quick Start Scaffold a new Salesforce UI bundle named CoffeeBoutique, configure its ui-bundle.json routing, and create CSP Trusted Site metadata for its external image and API domains.

Frequently Asked Questions about experience-ui-bundle-metadata-generate

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a new Salesforce UI bundle?▼

Use `sf template generate ui-bundle -n AppName --template reactbasic` to scaffold a React-based bundle. The name must be alphanumeric only, and you should replace all default boilerplate content and install dependencies before running scripts.

Why is my Salesforce UI bundle not visible in the org?▼

A UI bundle without a <target> element in its .uibundle-meta.xml will not appear anywhere in the org. Set the target to Experience for external sites or CustomApplication for App Launcher apps, and pair it with the corresponding companion metadata.

How do I fix CSP violations for external domains in Salesforce?▼

Create a CSP Trusted Site metadata file in force-app/main/default/cspTrustedSites/ for the blocked origin. Map the resource type to the correct directive field, such as isApplicableToImgSrc for images or isApplicableToConnectSrc for API calls.

What are the validation rules for ui-bundle.json?▼

The file must be valid UTF-8 JSON under 100 KB with a non-empty object root. Paths in outputDir and routing.fallback cannot contain backslashes, leading slashes, parent directory segments, globs, or percent signs, and outputDir must reference an existing non-empty subdirectory.

Does each subdomain need its own CSP Trusted Site entry?▼

Yes, each subdomain requires a separate entry. For example, Google Fonts needs two entries: fonts.googleapis.com for stylesheets and fonts.gstatic.com for font files, each with the appropriate directive flags enabled.

Related Skills

Explore More Software Engineering Skills→
dmckeeSFdmckeeSF

deploying-ui-bundle

Automate UI bundle deployment to Salesforce orgs with metadata and permissions.

Community
Advanced
CollabalistCollabalist

generating-ui-bundle-metadata

Generate UI Bundle metadata files for Salesforce projects.

Community
Intermediate
forcedotcomforcedotcom
803

building-ui-bundle-frontend

Enforce routing, styling, and module restrictions for Salesforce UI bundle frontend modifications.

Official
Intermediate
AvinavaAvinava
1

sf-knowledge-lightning

Consolidate Lightning Aura knowledge for Salesforce developers from topic files.

Community
Intermediate