D2C:选择图层并查看或导出代码
研发衔接 · D2C
选择图层并查看或导出代码
梳理设计交付到前端实现的流程时,可以把 D2C 作为直接起点:选定设计稿内容,设置代码框架,生成后在 Pixso 里检查并导出,再由团队结合项目规范完成集成。
我通常这样带你走一遍
- 打开 Pixso 设计文件,进入教程中的 D2C 功能入口。
- 先选定要转换的设计稿图层。建议从目标页面里一个边界清晰的区域开始,便于核对输出。
- 按项目需要选择代码框架,并查看当前界面提供的设置。
- 启动生成后,先在结果面板里检查代码,再决定是否导出。
- 将代码放入目标项目继续集成和验证;不要把一次生成结果当作已经完成的生产代码。
教程设计文件把入口、图层选择、框架设置和代码查看/导出分开讲解。建议跟着图示走一遍,再按你当前 Pixso 界面确认具体选项;可用范围会随版本或使用模式变化。
我会提醒你检查这些细节
- 选区是否覆盖了要交付的内容,是否混入无关图层。
- 生成代码中的结构、布局、文字和图片资源是否符合预期。
- 导出后是否需要调整为项目已有的组件、样式和工程组织方式。
- 框架与设置是否确实出现在当前 D2C 面板中;不要把其他模式的选项直接套用过来。
我如何区分 D2C 和 D2C+
我会先看你的目标:如果是按教程在设计界面里选择图层、设置框架并查看或导出代码,走 D2C;如果要在企业研发模式中生成代码,或把设计组件映射到项目组件库,则看 D2C+。D2C+ 有单独的席位和企业空间文件要求。
前往 D2C+:研发模式与组件映射 查看企业空间要求、D2C+ 生成步骤和 DSM 配置示例。
教程与延伸阅读
- Pixso D2C 教程设计文件:入口、选择图层、框架设置及代码查看/导出图示。访问可能需要登录并获得文件权限。
- Pixso D2C+ 快速开始:研发模式入口、企业空间使用前提和组件映射。
- Pixso MCP 工具与指令:在 Agent 工作流中调用设计转代码工具。
这是个人整理的实践说明,不代表官方产品公告。入口、支持框架和模式限制请以你的 Pixso 版本及官方说明为准。