Artifacts Builder 是一套用于创建复杂、多组件 claude.ai HTML 制品的工具套件，采用现代前端技术栈。
用途：帮助把 React 前端项目构建成可直接在 Claude 对话中作为制品查看的单个 HTML 文件。
技术栈：React 18 + TypeScript + Vite + Parcel（打包）+ Tailwind CSS + shadcn/ui。
使用方式分四步：第一步运行 bash scripts/init-artifact.sh <project-name> 初始化项目，并 cd <project-name>；该脚本会生成配置好的 React+TypeScript（Vite）项目，包含 Tailwind CSS 3.4.1 与 shadcn/ui 主题系统、路径别名（@/）、40 多个预装 shadcn/ui 组件、全部 Radix UI 依赖、用于打包的 Parcel 配置（.parcelrc），并兼容 Node 18+（自动检测并固定 Vite 版本）。第二步编辑生成的文件进行开发。第三步运行 bash scripts/bundle-artifact.sh，将应用打包为 bundle.html，它会安装打包依赖（parcel、@parcel/config-default、parcel-resolver-tspaths、html-inline），创建支持路径别名的 .parcelrc，用 Parcel 构建（不生成 source map），再用 html-inline 把所有资源内联为单个 HTML；要求项目根目录存在 index.html。第四步把打包后的 HTML 文件分享给用户查看。第五步为可选的测试/可视化，可用其他技能或 Playwright、Puppeteer 等内置工具进行，通常建议先展示制品、按需再测试。
设计规范强调避免“AI slop”，即避免过度居中布局、紫色渐变、统一的圆角以及 Inter 字体。
参考资料为 shadcn/ui 组件文档：https://ui.shadcn.com/docs/components。
限制：打包脚本要求根目录有 index.html；测试步骤为可选；初始化与打包命令需按原样执行。