React Doctor CLI
CLI проверяет код React без нейросети по состоянию, производительности, безопасности и доступности, ставит оценку 0–100 и дает агенту скилл для исправлений
- 15 039 ★ репозитория
- Последний коммит
Расширенный доступ
Почему такой уровень
- Команды берут `react-doctor@latest` из npm и выполняют код пакета в вашем проекте
- Программа по умолчанию отправляет отчеты о сбоях и обезличенные данные об использовании
- Скилл `/doctor` загружает сценарий с внешнего сайта и по нему правит файлы в рабочей папке
Установка
- Работает в
Ручная установка
npx react-doctor@latestЗапускается из корня проекта и сразу сканирует его, установка не требуется.
Доступ и проверки
Как мы проверяемРасширенный доступИнструмент запускает код или ходит в сеть, а внешние данные только читает.
- Команды берут `react-doctor@latest` из npm и выполняют код пакета в вашем проекте
- Программа по умолчанию отправляет отчеты о сбоях и обезличенные данные об использовании
- Скилл `/doctor` загружает сценарий с внешнего сайта и по нему правит файлы в рабочей папке
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
React Doctor — консольная программа, которая запускает детерминированные проверки в проекте на React и сообщает о проблемах с состоянием и эффектами, производительностью, архитектурой, безопасностью, доступностью и сопровождаемостью. Работает с проектами на Next.js, Vite, Astro, TanStack, React Native и Expo. Команда `npx react-doctor@latest` сканирует проект и выводит оценку здоровья кода от 0 до 100. Ключ `--verbose` показывает файлы и строки по каждому правилу, `--scope changed` оставляет только проблемы, появившиеся относительно базовой ветки, а `--scope lines` — только проблемы на измененных строках. Команда `npx react-doctor@latest install` копирует в папки выбранных агентов скилл `react-doctor`. Он велит после правок React запустить `npx react-doctor@latest --verbose --scope changed` и сверить оценку с прежней: если она снизилась, регрессии исправляют до коммита. По запросу `/doctor` скилл скачивает с сайта react.doctor подробный сценарий разбора и исправлений, который правит файлы в рабочей папке, но не коммитит и не открывает запросы на слияние. Для точечной проверки интерфейса есть подкоманда `design`. Команда `npx react-doctor@latest ci install` настраивает проверку каждого запроса на слияние, `npx react-doctor@latest scan http://localhost:3000` записывает трассу производительности Chrome DevTools, пока вы работаете с запущенным приложением. Правила и параметры лежат в файле `doctor.config.ts`.
Для кого. Для разработчиков на React и React Native, которые поручают агенту писать код и хотят автоматически ловить типичные ошибки до коммита.
Подходит, если
- Агент закончил фичу на React, и нужно проверить, не ухудшилось ли качество кода
- Хочется общей оценки здоровья проекта и списка проблем по важности
- Нужно проверять каждый запрос на слияние и видеть только проблемы, которые он добавил
- Интерфейс на React нужно проверить на типографику, доступность, анимации и композицию
- Нужна трасса производительности запущенного приложения, чтобы найти лишние перерисовки
Не подходит, если
- Проект не на React: правила рассчитаны на React и его окружение, для Vue или Angular они не подойдут
- Вам нужны код или отчеты как данные для обучения или оценки ИИ-моделей: лицензия требует для этого письменного разрешения
- Вы хотите предлагать программу третьим лицам как платный размещенный сервис или коммерческий API: это тоже требует разрешения владельца
- Нет доступа к сети: командам нужен `react-doctor@latest` из npm, а скилл `/doctor` загружает сценарий с react.doctor
- Нужен полный аудит безопасности: программа ловит типичные проблемы и не заменяет проверку
Пример запроса к агенту
Запусти React Doctor с флагом `--scope changed` и поправь все ошибки, которые он нашел, чтобы оценка не упалаОграничения
Лицензия — измененная MIT. Без письменного разрешения владельца нельзя использовать код и его производные как данные для обучения, дообучения и оценки ИИ-моделей. Запрещены также продажа программы и ее предложение как платного размещенного сервиса. Разрешение запрашивают по адресу founders@million.dev. Больше изменений в стандартной лицензии MIT автор не вносил.
Программа собирает отчеты о сбоях и обезличенные данные об использовании. Отказаться можно флагом `--no-telemetry`. Описание сбора данных вынесено на сайт react.doctor.
Скилл `react-doctor` при запросе `/doctor` скачивает сценарий с react.doctor и подтягивает по необходимости подсказки по отдельным правилам, поэтому поведение агента зависит от содержимого этих страниц на момент запроса.
Версия пакета 0.9.18.
В режиме `customRulesOnly` работают только правила, которые в `rules` заданы как `"warn"` или `"error"`; остальные и плагин React Compiler выключены.
Как отключить. Если пакет ставили в проект, уберите его командой менеджера пакетов, например `npm uninstall react-doctor`. Скопированный скилл `react-doctor` удалите из папки скиллов агента, а из проекта уберите файл `doctor.config.ts`, рабочий процесс CI и хуки git или агента, если их устанавливали. При запуске через `npx` остается только кэш npm в домашней папке пользователя.
Частые вопросы
Что показывает оценка от 0 до 100?
Общее здоровье кода по итогам детерминированных проверок. Скилл использует ее как контрольную точку: после правок оценка не должна снижаться, иначе агент исправляет регрессии до коммита.
Использует ли программа нейросеть?
Нет, проверки детерминированные и не зависят от модели. ИИ-агент нужен лишь для исправления найденных проблем по скиллу.
С какими агентами работает установка скилла?
Описание проекта называет Claude Code, Cursor, Codex и OpenCode. В репозитории есть и манифест плагина для Cursor.
Что делает подкоманда design?
Команда `npx react-doctor@latest design --verbose` запускает только правила с пометкой о дизайне: по композиции интерфейса, типографике, взаимодействию, доступности и анимации. Сюда входят и правила, которые в общем скане выключены.
Как записать трассу производительности?
Запустите приложение и выполните `npx react-doctor@latest scan http://localhost:3000`. Программа запишет трассу Chrome DevTools, пока вы работаете со страницей.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
CLI-инструментыCLI, который дает агенту смотреть работающее приложение на React: дерево компонентов, props, state, hooks и профилирование рендеров
Панель разметки для React-страниц: клик по элементу дает агенту селектор и контекст, скиллы настраивают подключение и сами ведут критику интерфейса
Подключает агента к запущенному dev-серверу Next.js 16+: ошибки, маршруты, логи и путь к документации нужной версии
Скиллы Vercel для агентов
Agent Skills
Скиллы Vercel: производительность React и Next.js, проверка UI по гайдлайнам, React Native, композиция компонентов и деплой
Рабочее место для Claude Code: десять команд ведут от идеи продукта к экранам на React и пакету передачи с готовыми промптами для реализации
MCP-сервер и скилл для интерфейсов: 31 дизайн-система для shadcn/ui, принципы UI и UX и проверка доступности для кода агента
Коротко о README
В описании проекта перечислены области проверки и поддерживаемые окружения, затем идут четыре шага: запуск скана, установка скилла для агентов, подключение CI и настройка правил в `doctor.config.ts`. Ниже описаны запись трассы производительности и сбор данных. Для разработчиков самого проекта есть скилл `rule-writing`. Код разложен по пакетам: ядро, API, плагины для oxlint и ESLint, наборы проверок и тесты фаззинга. Отдельно лежат действие GitHub и документ `docs/HOW_TO_WRITE_A_RULE.md` о написании собственного правила.
Бейдж для README
Исходный SKILL.md
--- name: react-doctor description: Use when finishing a feature, fixing a bug, before committing React code, or when the user types `/doctor`, asks to scan, triage, or clean up React diagnostics. version: "1.2.0" --- # React Doctor Scans React codebases for security, performance, correctness, and architecture issues. Outputs a 0–100 health score. ## After making React code changes: Run `npx react-doctor@latest --verbose --scope changed` and check the score did not regress. If the score dropped, fix the regressions before committing. ## For general cleanup or code improvement: Run `npx react-doctor@latest --verbose` (the default `--scope full`) to scan the full codebase. Fix issues by severity — errors first, then warnings. ## For a focused UI design audit: Run `npx react-doctor@latest design --verbose`. This selects only design-tagged UI composition, typography, interaction, accessibility, and motion rules.