angular-development · manutej — скилл для Claude Code: Angular без ошибок
Скилл по Angular: компоненты, сервисы, DI, роутинг, формы и Signals. Пригодится, когда агент пишет код на Angular и путает старые паттерны с новыми.
npx skills add manutej/luxor-claude-marketplace --skill angular-development -a claude-codeЧто делает angular-development
Скилл описывает современный Angular: standalone-компоненты, внедрение зависимостей через inject(), реактивные формы с валидацией, роутинг с ленивой загрузкой и гардами, состояние на Signals и RxJS. Внутри — примеры кода и разбор жизненного цикла компонентов, HTTP-интеграций, кастомных директив и пайпов. Отдельная тема — миграция со старых паттернов на новые.
Основа — официальная документация Angular, скилл привязан к библиотеке /angular/angular через Context7. Это значит, что агент подтягивает актуальные сигнатуры API, а не пишет по памяти. Полезно, когда проект уже на свежей версии, а модель норовит предложить NgModule и конструкторную инъекцию.
Скилл не заменяет сборку и не проверяет ваш код сам — он задаёт агенту рамки. Если в проекте своя архитектура, скажите об этом в промпте, иначе получите стандартный шаблон Angular.
Какие задачи решает
- переписать компонент на standalone и убрать лишний
NgModule - заменить конструкторную инъекцию на
inject()в сервисе - добавить ленивую загрузку маршрута с гардом
- собрать форму с валидацией на реактивных контролах
- перевести состояние компонента на Signals
Примеры запросов агенту
- Сделай standalone-компонент
user-profileс шаблоном и стилями - Перепиши
UserServiceнаinject()вместо конструктора - Настрой ленивую загрузку для маршрута
adminс гардом авторизации
Как установить angular-development
1Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill angular-development -a claude-code2Вручную: положить файлы
~/.claude/skills/angular-development/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/angular-development/
1Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill angular-development -a codex2Вручную: положить файлы
.agents/skills/angular-development/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill angular-development -a cursor2Вручную: положить файлы
.cursor/skills/angular-development/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install manutej/luxor-claude-marketplace angular-development2Вручную: положить файлы
.github/skills/angular-development/SKILL.md1Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill angular-development -a gemini-cli2Командой платформы
gemini skills install https://github.com/manutej/luxor-claude-marketplace --path plugins/luxor-frontend-essentials/skills/angular-developmentВручную: положить файлы
.devin/skills/angular-development/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill angular-development -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о angular-development
Как установить angular-development в Claude Code?
Выполните npx skills add manutej/luxor-claude-marketplace --skill angular-development -a claude-code. Файл скилла появится по пути ~/.claude/skills/angular-development/SKILL.md.
Что делает angular-development?
Даёт агенту справочник по Angular: компоненты, директивы, сервисы, внедрение зависимостей, роутинг, реактивные формы, Signals и RxJS. Примеры кода опираются на официальную документацию.
На чём основан скилл?
На официальной документации Angular, подключённой через Context7 к библиотеке /angular/angular. Поэтому агент берёт актуальные сигнатуры API, а не пишет по памяти.
Похожие скиллы
Всё по теме «Фронтенд и UI» →Сначала — angular-development от других авторов.