react-doctor · brianlovin — скилл для Claude Code: аудит React-кода
Скилл прогоняет React-кодовую базу по 47+ правилам и выдаёт оценку от 0 до 100 с указанием файлов и строк. Пригодится перед ревью или когда проект тормозит.
npx skills add brianlovin/agent-config --skill react-doctor -a claude-codeЧто делает react-doctor
Скилл запускает npx -y react-doctor@latest . --verbose в корне проекта и печатает диагностику с путями к файлам и номерами строк. Правила разбиты по группам: безопасность, состояние и эффекты, архитектура, производительность, корректность, Next.js, размер бандла, серверный код, доступность, мёртвый код. Оценка 75 и выше — хорошо, 50–74 — есть над чем работать, ниже 50 — критично.
Порядок работы простой: прогнать команду, прочитать все замечания, чинить начиная с ошибок — у них самая высокая важность, потом перезапустить и сверить оценку. Скилл ловит захардкоженные секреты в клиентском бандле и eval(), derived state внутри useEffect, компоненты, объявленные внутри других компонентов, индекс массива в роли key, barrel-импорты, полный lodash и moment.js, отсутствие авторизации в server actions.
Что важно заранее: скилл рассчитан на React-проект, для Vue, Svelte или обычного бэкенда он бесполезен. Часть правил завязана на Next.js, поэтому в чистом React-приложении эти замечания просто не появятся. Скилл ставится в Claude, Codex, Cursor, GitHub Copilot, Gemini CLI и OpenCode — файл скилла кладётся в каталог конкретного агента.
Какие задачи решает
- найти захардкоженные секреты в клиентском бандле
- убрать derived state из useEffect
- разбить гигантский компонент на части
- сократить бандл за счёт barrel-импортов и moment.js
- проверить авторизацию в server actions
Примеры запросов агенту
- прогони react-doctor по проекту и покажи все ошибки
- исправь замечания из react-doctor, начиная с самых важных
- запусти react-doctor ещё раз и скажи, выросла ли оценка
Как установить react-doctor
1Через Skills CLI (Vercel)
npx skills add brianlovin/agent-config --skill react-doctor -a claude-code2Вручную: положить файлы
~/.claude/skills/react-doctor/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/react-doctor/
1Через Skills CLI (Vercel)
npx skills add brianlovin/agent-config --skill react-doctor -a codex2Вручную: положить файлы
.agents/skills/react-doctor/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add brianlovin/agent-config --skill react-doctor -a cursor2Вручную: положить файлы
.cursor/skills/react-doctor/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install brianlovin/agent-config react-doctor2Вручную: положить файлы
.github/skills/react-doctor/SKILL.md1Через Skills CLI (Vercel)
npx skills add brianlovin/agent-config --skill react-doctor -a gemini-cli2Командой платформы
gemini skills install https://github.com/brianlovin/agent-config --path skills/react-doctorВручную: положить файлы
.devin/skills/react-doctor/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add brianlovin/agent-config --skill react-doctor -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о react-doctor
Как установить react-doctor в Claude?
Выполните npx skills add brianlovin/agent-config --skill react-doctor -a claude-code. Скилл окажется в ~/.claude/skills/react-doctor/SKILL.md.
Что делает react-doctor?
Сканирует React-кодовую базу по 47+ правилам и выдаёт оценку от 0 до 100 с диагностикой по файлам и строкам. Правила покрывают безопасность, производительность, корректность и архитектуру.
Какие правила проверяет react-doctor?
Среди них секреты в клиентском бандле, eval(), derived state в useEffect, компоненты внутри компонентов, индекс массива как key, barrel-импорты, полный lodash и moment.js, отсутствие авторизации в server actions.
Похожие скиллы
Всё по теме «Фронтенд и UI» →Сначала — react-doctor от других авторов.
