component-scaffolding

Generate Drupal/Twig component skeletons with web components and Miyagi validation.

Updated Feb 4, 2026
One-click install
npx skills add https://github.com/vidzza/JRM_SMTR_V- --skill component-scaffolding-vidzza
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: component-scaffolding
Source: https://github.com/vidzza/JRM_SMTR_V-/tree/main/.claude/skills/component-scaffolding
Command: npx skills add https://github.com/vidzza/JRM_SMTR_V- --skill component-scaffolding-vidzza

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automates the creation of boilerplate code for Drupal components, ensuring consistency and adherence to best practices across your project.

Core Features & Use Cases

  • Component Generation: Creates Twig templates, CSS, JavaScript (web components), schema, and mock files for new components.
  • Drupal Integration: Generates necessary library definitions (.libraries.yml) and CSS entry points.
  • Use Case: When a developer needs to add a new "card" component to the design system, this skill can generate all the necessary files and configurations in the correct locations.

Quick Start

Use the component-scaffolding skill to add a new component skeleton at patterns/card.

Frequently Asked Questions about component-scaffolding

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I scaffold a Drupal component with Twig and web components?

Scaffolding a Drupal component involves generating Twig templates, CSS, JavaScript web components, JSON schemas, and mock data files at a specified path. This ensures adherence to naming conventions and file structures for component libraries.

What is the best way to create boilerplate code for Drupal Twig components?

The best way to create boilerplate code for Drupal Twig components is to automate the generation of skeletons, including library definitions (.libraries.yml) and CSS entry points. This ensures consistency and adherence to best practices across the project.

Does this component scaffolding approach work with Miyagi validation?

Yes, this component scaffolding approach works with Miyagi validation. It generates component skeletons that include mock data files and JSON schemas specifically designed to integrate with Miyagi validation checks.

Can I generate a complete design system component library structure using Twig?

Yes, you can generate a complete design system component library structure using Twig. The scaffolding process creates all necessary files, including templates, stylesheets, scripts, and configuration files, in the correct locations.

What files are included when creating a new Drupal component skeleton?

When creating a new Drupal component skeleton, the generated files include Twig templates, CSS, JavaScript web components, JSON schemas, mock data files, and library definitions (.libraries.yml) with CSS entry points.