SkillProof tested Claude skills

Web Artifacts Builder

Scaffolder en ægte Vite + shadcn/ui React-app og bundler den til ét bærbart HTML-artefakt.

Af ThinkInAIXYZ · ThinkInAIXYZ/deepchat

Testet · Virker ★ 8.8/10

Web Artifacts Builder — Scaffolder en ægte Vite + shadcn/ui React-app og bundler den til ét bærbart HTML-artefakt.

Hvad det gør

Byggeværktøjer til claude.ai-artefakter, der vokser ud over en enkelt JSX-fil: et init-script scaffolder et Vite+TypeScript+Tailwind-projekt forudindlæst med 40+ ægte shadcn/ui-komponenter fra en bundlet tarball, hvorefter et bundle-script kompilerer og inliner alt (Parcel + html-inline) til én selvstændig bundle.html. Eksplicit afgrænset til komplekse, stateful, multi-komponent-artefakter — ikke simple enkeltfils HTML/JSX.

Testrapport

Dets init-script trækker en ægte 40-komponent shadcn/ui tarball (verificeret: downloades rent ved 19.9KB) og driver en ægte Vite+Parcel-bygning til en enkelt offline HTML-fil — ægte Radix-baserede komponenter, ikke hånd-approximerede Tailwind-lignende komponenter, som et baseline-artefakt ville producere.

Testet: 2026-07-13 · Claude Code 2.x (agent harness)

Installation

git clone https://github.com/ThinkInAIXYZ/deepchat
cd deepchat
mkdir -p ~/.claude/skills
cp -r resources/skills/web-artifacts-builder ~/.claude/skills/web-artifacts-builder

Kommandoer og eksempelprompter

  • /web-artifacts-builderScaffolder en ægte Vite + shadcn/ui React-app og bundler den til ét bærbart HTML-artefakt.

Skills udløses af almindelige forespørgsler — ingen kommandoer at huske. Efter installationen aktiverer prompter som disse skillen (på engelsk):

  • Build a multi-component React app with shadcn and bundle it into one HTML file
  • This artifact needs real state management, scaffold a Vite React project for it
  • Turn this stateful dashboard prototype into a single portable HTML artifact

Læs hele rapporten →