在 Salesforce 目标中使用组件
通过配置 .js-meta.xml 文件使组件可用于不同目标:Lightning App Builder、Experience Builder、Flow Builder、Email Builder,以及 CRM Analytics、自定义标签页、控制台应用、快速操作、Outlook/Gmail 集成、实用工具栏等。还可打包发布到 AppExchange。
从 Setup → Lightning Components 查看组织中所有组件列表。配置文件中可定义 targets(lightning__AppPage/lightning__RecordPage/lightning__HomePage 等)和 targetConfigs(设计时属性)。
托管包 —— 添加、配置与许可
托管包基础
推荐2GP(第二代托管包)用于所有新包——注册命名空间前缀、防命名冲突。订阅组织必须启用 LWS 才能引用托管包中的 LWC。1GP 在打包组织中管理。
发布后可编辑的字段:apiVersion/description/masterLabel/targetConfigs/targets + isExposed(仅能从 false→true)。组件名称锁定。
isExposed 关键规则
- false → 可移除 targets 和 @api 属性(组件不可用于其他命名空间/Builder)
- true + 已发布 → 不能移除 targets 或 @api 属性(即使发布后新增的)
- 删除 isExposed=true 的组件推荐两步流程——确保无依赖
许可(Licensing)
LWC 不自动强制托管包许可——即使无有效许可,用户也能看到和使用组件。ISV 负责自行强制许可——使用 Apex 调用 UserInfo.isCurrentUserLicensed(namespace) 或 isCurrentUserLicensedForPackage(packageID)。返回 false → 不渲染组件,显示消息告知用户未获许可。
使用托管 LWC
在自定义组件中使用:<namespace-component-name attribute-name="value">(kebab-case)。确保在 .js-meta.xml 中添加对应 targets。托管包作者需同时测试 LWS 和 Locker 环境。
CRM Analytics 与记录/对象上下文
CRM Analytics Dashboard
添加 analytics__Dashboard target + isExposed: true。可选 hasStep: true 启用量数据支持——额外支持 Measure 和 Dimension 数据类型。仪表板编辑器可从步骤结果中选择对应数据类型的列。
记录上下文(recordId)
用 @api recordId 在 JS 中声明——组件放在记录页面时自动填充18位记录 ID。仅在显式记录上下文中自动设置——其他情况需手动传值。Experience Builder 不自动绑定——需在 targetConfigs 中添加 recordId 属性,然后在 Builder 中输入 {!recordId} 表达式。
对象上下文(objectApiName)
@api objectApiName——自动设为当前对象的 API 名(仅记录上下文)。Experience Builder 同样需手动配置——在 targetConfigs 中添加 default="{!objectApiName}"。
宽度感知(flexipageRegionWidth)
@api flexipageRegionWidth——值为 SMALL/MEDIUM/LARGE。CSS 中用对应类名定义不同宽度下的渲染行为。
预测页面与自定义标签页
Forecasts Pages
添加 lightning__ForecastingPage target。预测页面变更(owner/forecast type)时通过 Lightning Message Channel 发布消息——订阅 lightning__forecasting_flexipageUpdated 频道来更新组件。预测页面不支持自定义组件派发的标准或自定义事件。
自定义标签页
添加 lightning__Tab target——不支持 property 和 supportedFormFactor 标签。创建标签页:Setup→Tabs→New(Lightning Component Tabs)→选择组件→输入标签→选择样式。添加到应用导航:App Manager→编辑应用→Navigation Items→选择组件标签→保存。导航到自定义标签页:NavigationMixin.Navigate({ type: 'standard__navItemPage', attributes: { apiName: 'My_Custom_Tab' } })。
Email Content Builder —— 配置与限制
添加 lightningStatic__Email target,apiVersion ≥ 53.0。支持的属性类型:Boolean/Color/Integer/String/HorizontalAlignment/VerticalAlignment。
不支持的项目:任何 DOM API、renderedCallback() 生命周期钩子、fetch() Web API、<script> 标签、window 对象引用、lightning 命名空间基础组件、@wire wire service、Apex 类(除 PicklistEntry/DynamicPicklist)。CSS 中不支持 SLDS tokens 和 :host 选择器——使用唯一类名或命名空间前缀。
自定义 HTML:给元素加 ishtmlcontainer="true" + lwc:dom="manual" → 用 getter/setter 管理 htmlValue 属性 → renderedCallback 中将值赋给容器 innerHTML。
感谢阅读本指南。如需继续学习,请参阅下一章:Experience Cloud 站点。