用途:从设计输入(Figma 帧、PRD、Aura 源码或文字描述)出发,编排新建 Lightning Web Component 的完整流程,本身不直接写代码,而是按阶段把任务交给各专门技能。不适用于重构已有 LWC、Aura 到 LWC 的原位迁移,以及纯样式或数据层工作。
前提:至少一个设计输入(Figma URL、PRD markdown、Aura 源码或文字规格);目标 LWC 模块路径;若组件读写数据,需可访问 org 以解析 schema 与适配器形态。
五个阶段(强制顺序):1. 收集 PRD 与需求,可参考 references/prd-analysis-template.md 与 references/figma-to-prd-blueprint.md,数据需求交给 experience-lds-data-requirements-generate,适配器选择交给 experience-lds-best-practices-apply。componentName 须为 camelCase,tagName 为其 kebab-case,需用脚本校验:"<skill_dir>/scripts/check-component-name.sh" <componentName> <tagName>。2. 生成组件代码,交给 experience-lwc-generate,样式按 SLDS 决策层级处理,只实现 PRD 描述的功能,不确定处用 // TODO。3. 优化,走性能与最佳实践清单,并做无障碍、安全、RTL 合规审查。4. Lint、格式化、编译检查,先用检测脚本读取工具配置:"<skill_dir>/scripts/detect-project-tools.sh" <projectRoot>,仅对报告为 yes 的工具执行对应步骤。5. 创建测试,含无障碍 Jest 覆盖及一般 Jest 测试。
完成标准:每条 PRD 需求已实现或标注 TODO;无遗留 console.log、占位值与注释代码;AI 元数据、SLDS、无障碍、安全、RTL 审查均通过;数据层与 LDS 适配器一致;Jest 覆盖率达项目阈值;如需要则产出 UTAM 页面对象。
限制:需配合强制顺序的兄弟技能使用;具体安装方式与收费情况暂未提供。