create-component
create-component — официальный skill Adobe для создания полноценных компонентов AEM. Исходная инструкция перечисляет состав результата: dialog, HTL-шаблон, Sling Model, unit-тесты и clientlibs. Навык рассчитан на компонентную разработку в Adobe Experience Manager, включая расширение Core Components и проектных компонентов. В отличие от общего генератора интерфейсов, он работает в контексте AEM-проекта и требует, чтобы структура проекта, группы пакетов и имена модулей были известны заранее. Ключевая проверка выполняется до изучения проекта. Skill требует прочитать файл .aem-skills-config.yaml в корне, на том же уровне, где находится pom.xml, и убедиться, что в нём установлено configured: true. Если файл отсутствует или configured: false, инструкция велит остановиться и попросить пользователя настроить проект; продолжать исследование и генерировать файлы нельзя, потому что без путей и package/group values можно создать компонент не в тех модулях или с неправильными именами. При успешной проверке из YAML берутся значения проекта, пакета и group, после чего можно переходить к созданию компонента. Типовые задачи включают создание teaser, card, hero, banner, accordion, tabs, carousel, list, navigation, breadcrumb или другого кастомного AEM-компонента. Тот же skill активируется, когда нужно расширить Core Component, добавить component dialog, создать Sling Model или перевести дизайн Figma в AEM-компонент. Если передан URL Figma, инструкция предусматривает получение design context через Figma MCP и перевод результата в HTL, CSS и JS; это отдельная ветка, для которой IDE должна иметь включённый plugin-figma-figma MCP server. Источник ограничивает поддерживаемое окружение: AEM as a Cloud Service или AEM 6.5 и Maven project structure с модулями core и ui.apps. Поэтому перед применением карточки нужно подтвердить версию AEM, наличие Maven-модулей и конфигурации. Unit-тесты, dialog, Sling Model, HTL и clientlibs входят в описанный состав компонента, но карточка не обещает, что конкретные требования проекта, дизайн-система, permissions или pipeline будут настроены автоматически. Сгенерированный результат следует собрать и проверить в реальном AEM-проекте. Практический порядок такой: сначала проверяется конфигурационный gate, затем определяется тип компонента и способ расширения, после чего формируется набор AEM-артефактов и тестов. Для Figma отдельно проверяется доступность MCP и исходного design context. Если gate не пройден, безопасный результат — остановка с сообщением о настройке, а не частичная генерация. Публичная директория Adobe skills, SKILL.md и license marker проверены; это подтверждает происхождение инструкции, но не является аудитом кода или гарантией корректности конкретного AEM-решения.
Для чего подходит
- Создание AEM-компонентов
- Добавление dialog и Sling Model
- Подготовка HTL, clientlibs и unit-тестов
Установка
Сначала прочитайте SKILL.md и scripts в исходном репозитории. Затем выполните команду в каталоге проекта:
npx skills add https://github.com/adobe/skills/tree/main/plugins/aem/cloud-service/skills/create-component