如果你经常需要在浏览器里快速查看 3D 文件（GLB/GLTF/STL/OBJ），同时想在交付前做一次“结构与资源健康检查”，这篇 Prompts 会让 AI 直接产出一个可运行的在线工具项目：支持拖拽上传与本地文件解析、WebGL 预览、网格/材质/纹理/尺寸统计、常见问题提示，并能一键导出 JSON/Markdown 检查报告，方便你发给同事或客户确认。
交付物：完整项目源码（清晰文件树）、本地运行命令、生产构建与部署说明（含 Docker）、基础自动化测试、QA checklist。
覆盖场景：产品/设计/3D 资产团队在上线前做自检；3D 资源下载站点做在线预览与信息展示；内部工具用于模型验收；教育/培训场景展示模型结构与资源构成。
把下面灰色块里的 Prompt 整段复制给你常用的 AI（建议选择擅长代码生成与工程化输出的模型）。你只需要在 Prompt 顶部把“目标文件类型、报告字段、部署目标”按自己的需求改一改，AI 就会生成一个可以直接跑起来的项目。
角色：你是一名资深前端工程师 + WebGL/three.js 工程顾问 + 代码审计员。请输出一个可运行、可构建、可部署的“3D 模型在线预览与质量检查工具”。
目标：用户在浏览器上传 GLB/GLTF/STL/OBJ 后，页面显示 3D 预览与基础交互（旋转/缩放/平移、重置视角、环境光开关、线框模式切换），并生成“检查报告”，可下载为 JSON 与 Markdown。
技术栈与约束
- 使用 React + Vite（Type ）。渲染使用 three.js（包含必要的 loader：GLTFLoader、STLLoader、OBJLoader）。
- 不调用任何外部后端；默认纯前端运行即可（离线也能用）。如需后端，仅作为可选方案，并提供 Docker Compose。
- 禁止任何“生成图片/渲染图/海报/插画/出图”导向功能；只做现有 3D 文件的预览、解析、检查、导出报告。
功能需求
1) 上传与解析：支持拖拽/点击上传；对不同格式做不同解析路径；解析失败要给出可读错误信息。
2) 预览交互：OrbitControls；默认自适应居中与合适的相机距离；提供“重置相机/截图（可选）/全屏（可选）”。
3) 统计与检查（在侧栏展示）：
- 基础统计：文件名、格式、文件大小、加载耗时、包围盒尺寸、模型中心点。
- 几何统计：mesh 数量、顶点数、面数、draw calls 估算、是否含法线/UV、是否存在非三角面（若格式支持）。
- 材质与纹理：材质数量与类型、纹理引用数量、是否存在缺失纹理（对 glTF 的 image/uri 做检查），是否存在过大纹理提示（阈值可配置）。
- 结构风险提示：空节点、极端缩放、异常坐标（NaN/Infinity）、过大面数/顶点数提醒、未居中导致的视角问题提示。
4) 报告导出：
- 一键导出 JSON（机器可读）与 Markdown（人类可读）。
- 报告字段要有版本号、生成时间、阈值配置、检查结果（pass/warn/fail）与建议。
5) 可配置阈值（UI 可编辑）：例如最大顶点数、最大纹理分辨率、最大材质数量等，修改后立即重新计算报告。
工程化交付（硬性要求）
- 输出完整文件树（tree 形式），并把每个关键文件的代码完整贴出，不要省略核心实现。
- 提供本地运行命令：安装、启动、构建、预览。
- 提供部署方案：静态站点（Vercel/Netlify 任一）+ Dockerfile（nginx 静态托管）两种，给出最小可用配置与命令。
- 提供测试：至少包含 1 个单元测试（例如报告生成器）+ 1 个 E2E 测试（例如上传示例文件后侧栏出现关键统计字段）。测试框架建议 Vitest + Playwright。
- 提供 QA checklist（不少于 12 条），覆盖不同格式、异常文件、移动端兼容、性能与可访问性。
输出格式
按以下顺序输出：简介（2-4 段）→ 功能清单 → 文件树 → 关键实现代码（按文件分块）→ 命令与脚本 → 部署说明 → 测试说明与示例 → QA checklist。
如果你要把它变成团队内部的验收工具，建议加上“报告模板”和“预设阈值”两件事：不同项目/平台（Web、移动端、VR）阈值差异很大，把常用阈值做成 presets 能减少争论成本。另外可以把导出的 Markdown 报告固定成你们常用的评审格式（例如包含结论、风险、建议修复路径）。
发布前请重点检查：上传 GLB/GLTF 是否能正确读取纹理引用；STL/OBJ 的单位与坐标轴差异是否在 UI 里明确提示；大型模型是否会导致页面卡死（可以加“加载中”与“超阈值警告”）；报告导出的字段是否稳定（方便后续做自动化对比）。
如果出现“能加载但看不到模型”，通常是相机距离与模型尺寸不匹配或模型中心偏移：确保自动居中与包围盒适配逻辑存在，并给用户一个“重置视角”按钮。如果 glTF 纹理缺失，优先检查 uri 路径与跨域限制；纯前端场景建议只支持内嵌纹理或同源读取，并在报告里把缺失项明确列出来。
