用途：为 claude.ai 构建复杂、多组件的前端 HTML 制品。流程为：用 scripts/init-artifact.sh 初始化前端仓库，编辑生成的代码开发制品，用 scripts/bundle-artifact.sh 打包成单个 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 依赖、通过 .parcelrc 配置的 Parcel 打包，以及 Node 18+ 兼容（自动检测并固定 Vite 版本）。
第二步开发制品：编辑生成的文件进行构建，可参考文档中的常见开发任务。
第三步打包为单个 HTML：运行 bash scripts/bundle-artifact.sh，生成 bundle.html，将全部 JavaScript、CSS 与依赖内联为自包含制品，可直接在 Claude 对话中作为制品分享。要求项目根目录存在 index.html。脚本会安装打包依赖（parcel、@parcel/config-default、parcel-resolver-tspaths、html-inline），创建支持路径别名的 .parcelrc 配置，用 Parcel 构建（不含 source map），再用 html-inline 将全部资源内联为单个 HTML。
第四步分享：在对话中分享打包后的 HTML 文件，用户可将其作为制品查看。
第五步测试（可选）：仅在必要或被要求时进行。可用其他技能或 Playwright、Puppeteer 等内置工具测试；通常避免提前测试，以免增加请求到成品可见之间的延迟，可在展示制品后按需测试或出现问题再测。
设计风格注意事项：为避免常见的“AI slop”，应避免过度使用居中布局、紫色渐变、统一圆角以及 Inter 字体。
限制：打包要求根目录有 index.html；资料未提供更多边界条件、平台限制或收费信息。shadcn/ui 组件文档见 https://ui.shadcn.com/docs/components。