这篇内容给你一组可直接复制给 AI 的提示词(Prompts),目标是让 AI 生成一个可运行、可构建、可部署的在线工具:上传 DXF 或 SVG 后,在线预览图层/分组、进行尺寸与单位校验、输出可下载的检查报告。
交付物清单
完整项目源码(前端+后端/接口)、清晰文件树、开发与生产运行命令、Docker 部署方案、最少一套自动化测试或 QA checklist,以及一份可复制的部署说明(例如 Vercel/Render/自建)。
适用场景
设计/工程团队在交付前需要快速确认:图层命名是否合规、单位/比例是否正确、画布边界是否超出、关键图层是否缺失、输出尺寸是否满足印刷/切割/机加工的要求。
Prompt:生成 DXF/SVG 图层预览与尺寸校验 Web 工具
你是资深全栈工程师与技术写作者。请为我生成一个"DXF/SVG 在线预览与尺寸校验"的 Web 工具,要求输出:
1) 完整可运行的项目源码(不要省略文件),并按文件树逐个给出内容;
2) 本地运行命令、构建命令、生产启动命令;
3) Dockerfile + docker-compose.yml(可选),并说明如何一键部署;
4) 至少一套测试(Playwright 或 Vitest/React Testing Library),或一份覆盖关键路径的 QA checklist;
5) README:功能说明、限制说明、常见问题与排错;
功能需求(必须全部实现):
- 前端:Next.js (App Router) + Type + TailwindCSS;
- 上传:支持拖拽上传 DXF 或 SVG(最大 20MB),并显示解析进度与错误提示;
- 预览:
- SVG:在浏览器中渲染,提供缩放/平移/适配画布;
- DXF:解析为几何图元并渲染到 Canvas/SVG(可选其一),要求在常见 DXF 图元上可用(LINE/POLYLINE/LWPOLYLINE/CIRCLE/ARC/TEXT/MTEXT);
- 图层/分组面板:列出图层(DXF layer / SVG group),支持搜索、显示/隐藏、统计对象数量;
- 尺寸与单位校验:
- 计算整体 bounding box(宽高)并展示;
- 提供单位选择(mm/cm/in/px),支持单位换算与比例校验;
- 给出"疑似比例错误"的提示规则(例如宽高过大/过小阈值可配置);
- 规则校验:至少内置 6 条可开关规则(如:图层命名正则、是否存在必选图层、文本是否包含非 ASCII、线宽/颜色是否为默认、空图层、超出安全边距等);
- 报告导出:一键导出 JSON + Markdown 两种报告(包含文件基本信息、图层统计、尺寸、规则命中详情、建议修复项),并可下载;
- 隐私:所有解析与校验在本地浏览器完成(不要把文件上传到第三方)。如果必须用服务端,请提供"纯前端模式"开关并默认纯前端;
- 性能:对大文件要做增量渲染或分层渲染的说明,并避免阻塞主线程(可用 Web Worker);
实现提示(可用但不强制):
- DXF 解析可使用 dxf-parser(或其他开源库);
- SVG 解析可使用 DOMParser + 自行遍历或 svgson;
- 规则系统建议做成可扩展的 rule registry(id/name/severity/check/fixHint)。
输出要求:
- 必须给出文件树;
- 每个文件内容用代码块输出;
- 所有命令与端口写清楚;
- 代码可直接复制粘贴运行;
- 不要生成任何图片、海报或渲染图相关功能。
Prompt:为工具补齐部署与回归测试
请基于上一条生成的项目,继续补齐以下内容(输出为可直接粘贴到项目的文件与命令):
- 增加 /api/health(如为纯前端模式则提供模拟 health),并在 README 写明;
- 增加 CI(GitHub Actions):安装依赖、类型检查、单测、Playwright e2e;
- 增加 3 份示例测试数据的生成脚本:
1) 简单 SVG(含 2 个分组与文本)
2) 大型 SVG(随机生成大量路径)
3) 简单 DXF(至少含 LINE/CIRCLE/TEXT)
- 增加回归用例:校验 bounding box 计算、规则开关、报告导出内容一致性;
- 提供 Vercel 部署与 Docker 部署两套说明,并给出环境变量清单。
注意:不要引入任何图像生成/渲染图功能。
Prompt:生成产品化的 FAQ 与错误码表
请为该 DXF/SVG 在线预览与尺寸校验工具输出一份"面向用户"的文档:
- 10 条 FAQ(包含:上传失败、编码问题、DXF 无法解析、字体缺失、尺寸不对、单位换算、性能慢、规则误报、导出报告打不开、隐私说明);
- 设计一套错误码(例如 UPLOAD_001 / PARSE_DXF_002 / RULE_XXX),每个错误码给出用户提示语与开发者排查建议;
- 给出一份 QA checklist(不少于 20 条),覆盖:主要浏览器、移动端兼容、性能、可访问性、导出结果、异常分支。
使用方式
把任意一段 Prompt 复制到你常用的 AI(如 ChatGPT/Claude/Gemini 等),让它按要求输出完整代码与说明;再按生成的命令本地运行或部署即可。