What problem does it solve? Implementing AEM Edge Delivery Services blocks in a TypeScript + Vite project requires strict conventions — auto-discovered block entries, @/* import aliases, null-safe DOM queries, replaceChildren() mutations, and DOMPurify sanitization. This Skill guides AI agents through those conventions so block code compiles cleanly and follows project standards. ## Core Features & Use Cases - Block Development Workflow: Step-by-step process for creating new blocks in src/blocks/ or modifying existing ones, from pattern research through TypeScript decoration and CSS styling. - TypeScript & CSS Enforcement: Bundled reference guidelines covering the exact decorate(block: HTMLElement) signature, null-guarding under strictNullChecks, design-token usage, mobile-first breakpoints, and scoped selectors. - Core File Changes: Guidance for safely modifying src/app/scripts.ts, global styles, and src/app/delayed.ts with minimal blast radius. - Use Case: A developer asks the AI to build a new hero block; the Skill walks through creating src/blocks/hero/hero.ts and hero.css, reusing existing <picture> elements, applying design tokens, and handing off to the testing skill. ## Quick Start Use the aem-skill-building-blocks skill to create a new cards block in src/blocks with TypeScript decoration and responsive CSS.
