integrating-b2b-commerce-open-code-components

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

When to Use This Skill

使用此技能的场景

Use this skill when you need to:

Integrate all open source B2B Commerce components into a store
Add open source components to a new or existing B2B Commerce store
Make open code components available in Experience Builder

当你需要以下操作时，使用此技能：

将所有开源B2B Commerce组件集成到商店中
为新的或现有的B2B Commerce商店添加开源组件
使开源代码组件在Experience Builder中可用

Rules

规则

Always explain before executing. Before running any command, you MUST tell the user what the command does and why you are running it. Never just show a raw command and ask for permission. The user should be able to read your explanation and understand the purpose before approving.

执行前务必说明。在运行任何命令之前，必须告知用户该命令的作用以及运行它的原因。绝不能直接显示原始命令并请求许可。用户应能通过你的解释理解操作目的，然后再批准执行。

Overview

概述

This skill copies all open source B2B Commerce components from the official Salesforce repository (https://github.com/forcedotcom/b2b-commerce-open-source-components) into a B2B Commerce store's site metadata. After integration, the components appear in the Experience Builder component palette.

此技能会将官方Salesforce仓库（https://github.com/forcedotcom/b2b-commerce-open-source-components）中的所有开源B2B Commerce组件复制到B2B Commerce商店的站点元数据中。集成完成后，这些组件将出现在Experience Builder的组件面板中。

Startup Flow

启动流程

When this skill is triggered, perform these checks automatically before copying.

触发此技能后，在复制组件前自动执行以下检查。

Check 0: Resolve Package Directory

检查0：解析包目录

Read

sfdx-project.json

and pick the active package directory. Extract

packageDirectories[]

and use the entry with

"default": true

; if no entry is flagged default, use the first entry. Use this value as

<package-dir>

everywhere below. If

sfdx-project.json

is missing or has no

packageDirectories

, tell the user and abort.

读取

sfdx-project.json

并选择活动包目录。提取

packageDirectories[]

数组，使用标记为

"default": true

的条目；如果没有默认条目，则使用第一个条目。将此值作为下文所有位置的

<package-dir>

。如果

sfdx-project.json

缺失或没有

packageDirectories

，告知用户并终止操作。

Check 1: Open Source Repository

检查1：开源仓库

Verify the repo is cloned at

.tmp/b2b-commerce-open-source-components

If directory does not exist: Tell user: "I'm cloning the official B2B Commerce open source components repository from GitHub into a local
```
.tmp/
```
folder. This gives us access to all the open code components." Then run:
```
git clone https://github.com/forcedotcom/b2b-commerce-open-source-components .tmp/b2b-commerce-open-source-components
```
If directory exists and contains
```
force-app/main/default/sfdc_cms__lwc
```
and
```
sfdc_cms__label
```
, present options:
"Open source repository is already cloned. How would you like to proceed?"
1. Reuse existing — Use the already cloned repository
2. Re-clone — Remove and clone fresh from GitHub
If directory exists but structure is invalid: Tell user: "The cloned repository has an unexpected structure. I'll remove it and clone a fresh copy." Then remove and re-clone.
If clone fails: inform user and abort

验证仓库是否已克隆到

.tmp/b2b-commerce-open-source-components

如果目录不存在：告知用户：“我将从GitHub把官方B2B Commerce开源组件仓库克隆到本地
```
.tmp/
```
文件夹中，这样我们就能获取所有开源代码组件。” 然后运行命令：
```
git clone https://github.com/forcedotcom/b2b-commerce-open-source-components .tmp/b2b-commerce-open-source-components
```
如果目录已存在且包含
```
force-app/main/default/sfdc_cms__lwc
```
和
```
sfdc_cms__label
```
，提供选项：
“开源仓库已克隆。你希望如何继续？”
1. 复用现有仓库 — 使用已克隆的仓库
2. 重新克隆 — 删除现有仓库并从GitHub重新克隆
如果目录已存在但结构无效：告知用户：“已克隆的仓库结构不符合预期。我将删除它并克隆一份全新的副本。” 然后删除并重新克隆。
如果克隆失败：告知用户并终止操作

Check 2: Store and Site Metadata

检查2：商店与站点元数据

Verify a store is selected and site metadata is available locally:

Tell user: "I'm checking if your project already has B2B store metadata locally." Check if
```
<package-dir>/main/default/digitalExperiences/site/
```
contains any store directories.
If store metadata exists: use it. If multiple stores found, ask user to select one.
If no store metadata found: Try retrieving from the connected org before delegating:
1. Run
```
sf org list
```
  (or check
```
sf config get target-org
```
  ) to find a connected org. Ask the user to confirm or pick one if more than one.
2. List
```
DigitalExperienceBundle
```
  site bundles in that org with
```
sf org list metadata --metadata-type DigitalExperienceBundle --target-org <alias>
```
  . Filter to
```
site/*
```
  entries.
3. If at least one site bundle exists, ask the user which to use, then run:
```
sf project retrieve start --metadata "DigitalExperienceBundle:site/<storeName>" --target-org <alias>
```
  The bundle lands at
```
<package-dir>/main/default/digitalExperiences/site/<storeName>/
```
  .
4. Only if no connected org is available, or no site bundles are found, or retrieve fails: delegate to the creating-b2b-commerce-store skill.

Required state after all checks:

Package dir — the value resolved in Check 0 (e.g.,
```
force-app
```
)
Store name — the selected
```
fullName
```
value (e.g.,
```
My_B2B_Store1
```
)

Site metadata path —

<package-dir>/main/default/digitalExperiences/site/<store-name>/

Repo path —

.tmp/b2b-commerce-open-source-components/

验证是否已选择商店且本地有可用的站点元数据：

告知用户：“我正在检查你的项目本地是否已有B2B商店元数据。” 检查
```
<package-dir>/main/default/digitalExperiences/site/
```
是否包含任何商店目录。
如果商店元数据存在：使用该元数据。如果找到多个商店，请用户选择其中一个。
如果未找到商店元数据：尝试从已连接的组织中检索，若失败则委托给creating-b2b-commerce-store技能：
1. 运行
```
sf org list
```
  （或检查
```
sf config get target-org
```
  ）查找已连接的组织。如果有多个组织，请用户确认或选择其中一个。
2. 使用命令
```
sf org list metadata --metadata-type DigitalExperienceBundle --target-org <alias>
```
  列出该组织中的
```
DigitalExperienceBundle
```
  站点包，筛选出
```
site/*
```
  条目。
3. 如果至少存在一个站点包，请用户选择要使用的包，然后运行：
```
sf project retrieve start --metadata "DigitalExperienceBundle:site/<storeName>" --target-org <alias>
```
  包将被下载到
```
<package-dir>/main/default/digitalExperiences/site/<storeName>/
```
  目录。
4. 仅当没有可用的已连接组织、未找到站点包或检索失败时：委托给creating-b2b-commerce-store技能。

所有检查完成后的必要状态：

包目录 — 检查0中解析的值（例如：
```
force-app
```
）
商店名称 — 选中的
```
fullName
```
值（例如：
```
My_B2B_Store1
```
）

站点元数据路径 —

<package-dir>/main/default/digitalExperiences/site/<store-name>/

仓库路径 —

.tmp/b2b-commerce-open-source-components/

Integration Task

集成任务

Copy all components and labels from cloned repo to site directory:

Source:

.tmp/b2b-commerce-open-source-components/force-app/main/default/sfdc_cms__lwc/*

and

sfdc_cms__label/*

(the open source repo's own layout — always

force-app

)

Destination:

<package-dir>/main/default/digitalExperiences/site/<store-name>/sfdc_cms__lwc/

and

sfdc_cms__label/

(

<package-dir>

resolved in Check 0)

Steps:

Tell user: "I'm checking if open code components already exist in your store's site metadata." Check if destination directories already contain files.
If files exist, present options:
"Components already exist in {store-name}. How would you like to proceed?"
1. Overwrite all — Replace all existing components with latest from repo
2. Copy only new — Skip existing components, copy only ones not yet present
Tell user: "I'm now copying all open code LWC components from the cloned repository into your store's site metadata directory." Copy all component directories from source to destination.
Tell user: "I'm copying the associated label files that these components need." Copy all label directories from source to destination.
Report: "Copied X components and Y label sets"

Output:

✅ Integration Complete!

Copied: X components and Y label sets to <store-name>

Next Steps:
1. Deploy: sf project deploy start -d <package-dir>/main/default/digitalExperiences/site/<store-name>
2. Open Experience Builder and use new components from the palette
3. Publish your site when ready

将克隆仓库中的所有组件和标签复制到站点目录：

源路径：

.tmp/b2b-commerce-open-source-components/force-app/main/default/sfdc_cms__lwc/*

和

sfdc_cms__label/*

（开源仓库自身的目录结构 — 始终为

force-app

）

目标路径：

<package-dir>/main/default/digitalExperiences/site/<store-name>/sfdc_cms__lwc/

和

sfdc_cms__label/

（

<package-dir>

为检查0中解析的值）

步骤：

告知用户：“我正在检查你的商店站点元数据中是否已存在开源代码组件。” 检查目标目录是否已包含文件。
如果文件已存在，提供选项：
“**{store-name}**中已存在组件。你希望如何继续？”
1. 覆盖全部 — 用仓库中的最新版本替换所有现有组件
2. 仅复制新增组件 — 跳过现有组件，仅复制尚未存在的组件
告知用户：“我现在正在将克隆仓库中的所有开源代码LWC组件复制到你的商店站点元数据目录中。” 将所有组件目录从源路径复制到目标路径。
告知用户：“我正在复制这些组件所需的关联标签文件。” 将所有标签目录从源路径复制到目标路径。
报告：“已复制X个组件和Y组标签”

输出：

✅ 集成完成！

已复制：X个组件和Y组标签到<store-name>

后续步骤：
1. 部署：sf project deploy start -d <package-dir>/main/default/digitalExperiences/site/<store-name>
2. 打开Experience Builder，从面板中使用新组件
3. 准备就绪后发布你的站点

Example Interaction

交互示例

User: "Integrate open code components to my store"

Agent: "I'm checking if the open source components repository is already cloned locally..."

Agent: (repo exists)

"Open source repository is already cloned. How would you like to proceed?"

Reuse existing — Use the already cloned repository

Re-clone — Remove and clone fresh from GitHub

User: "1"

Agent: "I'm checking if your project already has B2B store metadata locally..."

✓ Found store metadata for My_B2B_Store1

Agent: "I'm checking if open code components already exist in your store's site metadata..."

Agent: (files exist)

"Components already exist in My_B2B_Store1. How would you like to proceed?"

Overwrite all — Replace all existing components with latest from repo

Copy only new — Skip existing components, copy only ones not yet present

User: "1"

Agent: "I'm now copying all open code LWC components from the cloned repository into your store's site metadata directory..." Agent: "I'm copying the associated label files that these components need..."

✓ Copied 45 components and 38 label sets

✅ Integration Complete!

Copied: 45 components and 38 label sets to My_B2B_Store1

Next Steps:
1. Deploy: sf project deploy start -d force-app/main/default/digitalExperiences/site/My_B2B_Store1
2. Open Experience Builder and use new components from the palette
3. Publish your site when ready

用户：“将开源代码组件集成到我的商店”

Agent：“我正在检查开源组件仓库是否已在本地克隆...”

Agent：(仓库已存在)

“开源仓库已克隆。你希望如何继续？”

复用现有仓库 — 使用已克隆的仓库

重新克隆 — 删除现有仓库并从GitHub重新克隆

用户：“1”

Agent：“我正在检查你的项目本地是否已有B2B商店元数据...”

✓ 找到My_B2B_Store1的商店元数据

Agent：“我正在检查你的商店站点元数据中是否已存在开源代码组件...”

Agent：(文件已存在)

“My_B2B_Store1中已存在组件。你希望如何继续？”

覆盖全部 — 用仓库中的最新版本替换所有现有组件

仅复制新增组件 — 跳过现有组件，仅复制尚未存在的组件

用户：“1”

Agent：“我现在正在将克隆仓库中的所有开源代码LWC组件复制到你的商店站点元数据目录中...” Agent：“我正在复制这些组件所需的关联标签文件...”

✓ 已复制45个组件和38组标签

✅ 集成完成！

已复制：45个组件和38组标签到My_B2B_Store1

后续步骤：
1. 部署：sf project deploy start -d force-app/main/default/digitalExperiences/site/My_B2B_Store1
2. 打开Experience Builder，从面板中使用新组件
3. 准备就绪后发布你的站点

Error Handling

错误处理

Error	Message	Action
Store not found	"Store '{name}' not found in org."	List stores again
Git clone failed	"Failed to clone repository. Check internet connection."	Retry or abort
Invalid repo structure	"Repository structure has changed. Expected sfdc_cms__lwc and sfdc_cms__label."	Warn user, abort
File copy failed	"Failed to copy files. Check file permissions."	Show error details

错误	提示信息	操作
未找到商店	“商店'{name}'在组织中不存在。”	重新列出商店
Git克隆失败	“克隆仓库失败，请检查网络连接。”	重试或终止操作
仓库结构无效	“仓库结构已更改，预期包含sfdc_cms__lwc和sfdc_cms__label。”	警告用户并终止操作
文件复制失败	“文件复制失败，请检查文件权限。”	显示错误详情

Verification Checklist

验证清单

Startup Flow completed: repo cloned, store metadata available
Components copied to correct destination path (
```
sfdc_cms__lwc/
```
)
Labels copied to correct destination path (
```
sfdc_cms__label/
```
)
No file permission errors during copy
Deployment command provided and user informed about testing

启动流程已完成：仓库已克隆，商店元数据可用
组件已复制到正确的目标路径(
```
sfdc_cms__lwc/
```
)
标签已复制到正确的目标路径(
```
sfdc_cms__label/
```
)
复制过程中无文件权限错误
已提供部署命令并告知用户测试相关事宜