metro-mcp — отладка React Native через агента
metro-mcp
MCP-сервер для отладки React Native: логи, сеть, состояние Redux и дерево компонентов из Metro, плюс управление симулятором
- 89 ★ репозитория
- Последний коммит
- MIT
Широкий доступ
Почему такой уровень
- Инструмент выполняет JavaScript в приложении и может отправлять действия Redux и управлять устройством
- Читает AsyncStorage и файлы песочницы, где бывают токены и данные пользователей
Установка
- Работает в
В терминале, через SkillFoxx CLI
npx skillfoxx add mcp/metro-mcpОпределит агенты на машине, покажет уровень доступа и зафиксирует версию.
Другие способы установки
Доступ и проверки
Как мы проверяемШирокий доступИнструмент может менять данные, выполнять команды или работать с секретами.
- Инструмент выполняет JavaScript в приложении и может отправлять действия Redux и управлять устройством
- Читает AsyncStorage и файлы песочницы, где бывают токены и данные пользователей
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
metro-mcp подключается к запущенному серверу Metro так же, как Chrome DevTools: находит Metro по портам 8081, 8082 и 19000–19002 и соединяется с Hermes по протоколу Chrome DevTools. Для большинства возможностей код приложения менять не надо. Работает с Expo, голым React Native и любым проектом на Metro и Hermes. Сервер собран из плагинов. Среди них логи консоли, запросы сети с телами ответов, ошибки среды выполнения и сборки, дерево компонентов, состояние Redux, чтение AsyncStorage, файлы песочницы приложения, навигация React Navigation и Expo Router, проверка доступности, профилировщик и выполнение JavaScript в приложении. Есть и управление устройствами: симулятор iOS и эмулятор Android, нажатия и свайпы, глубокие ссылки, разрешения. Плагин записи тестов превращает действия в тесты для Appium, Maestro или Detox.
Для кого. React Native разработчикам, которые отлаживают приложение с Claude Code, Codex, Cursor или OpenCode и хотят, чтобы агент видел логи, сеть и состояние.
Подходит, если
- Приложение падает, и агент должен прочитать ошибки среды выполнения и стек с символизацией
- Нужно понять, какой запрос вернул неверный ответ, по телам из сетевого плагина
- Надо воспроизвести сценарий: открыть глубокую ссылку, нажать кнопки и записать тест для Maestro
- Проверяется состояние Redux до и после действия пользователя
Не подходит, если
- Приложение не на Hermes: для подключения нужны React Native 0.70 или новее и движок Hermes
- Нужен отладчик с точками останова: сервер читает и управляет, но шаги отладки не заменяет
- Агент работает с продакшен-сборкой: выполнение JavaScript и управление устройством рассчитаны на среду разработки
Пример запроса к агенту
Подключись к Metro, покажи последние ошибки и сетевые запросы со статусом 500 и открой экран профиля по глубокой ссылке.MCP
- Транспорт
- stdio
- Авторизация
- не нужна
Ограничения
Нужны Node.js 18 или Bun 1.0, для iOS Xcode 14 и более поздний с Simulator, для Android Android SDK с `adb` в PATH. Часть операций на iOS при необходимости использует IDB: `brew install idb-companion`, инструменты сами подскажут, когда он нужен. Совместимость: React Native от 0.70 с Hermes, Expo SDK 49 и новее.
Стандартная установка запускает или переиспользует общий локальный демон для одного каталога проекта, поэтому Codex, Claude Code и Cursor подключаются одновременно. Инструмент определения компонента по координатам помечен автором как экспериментальный.
Как отключить. Удалите сервер командой `claude mcp remove metro-mcp` или уберите запись из конфигурации Codex, Cursor и OpenCode. Остановить общий локальный демон можно, закрыв клиентов проекта.
Частые вопросы
Как поставить metro-mcp в Claude Code?
Выполните `claude mcp add metro-mcp -- npx -y metro-mcp`. Вариант с Bun: `claude mcp add metro-mcp -- bunx metro-mcp`.
Нужно ли менять код приложения?
Для большинства функций нет: сервер подключается к Metro и Hermes как Chrome DevTools. Дополнительная интеграция описана как необязательная.
Работает ли с Expo?
Да, с Expo SDK 49 и новее, с голым React Native 0.70 и новее и с любым проектом на Metro и Hermes.
Какие тесты умеет записывать?
Плагин записи тестов превращает взаимодействия в тесты для Appium, Maestro и Detox.
Можно ли использовать несколько клиентов сразу?
Да. Codex, Claude Code, Cursor и другие подключаются к одному общему локальному демону для того же каталога проекта.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
MCP-серверыMCP-сервер для работающего React Native: логи, сеть, состояние, скриншоты и нажатия, чтобы агент проверял правку на устройстве
Прозрачный прокси между ИИ-клиентом и MCP-сервером: показывает каждый кадр JSON-RPC в терминале, проверяет запись в CI и экспортирует спаны
MCP-сервер отладчика Node.js: агент ставит точки останова, идет по шагам, смотрит переменные и вычисляет выражения в паузе
Отладчик без среды разработки: агент ставит точки останова, шагает по коду и смотрит переменные в десяти языках
Плагин со скиллами для сборки MCP-серверов и MCP-приложений на TypeScript: агент создает, дорабатывает, отлаживает и проверяет их
CLI openmcp и расширение VS Code для отладки MCP-серверов: проверка инструментов, промптов и ресурсов, чат с моделью, тесты
Сравнение с похожими
Карточки с тем же главным запросом: чем они отличаются.
| Инструмент | Официальный | Авторизация | Звезды репозитория | Главное отличие |
|---|---|---|---|---|
| metro-mcp — отладка React Native через агента (эта карточка) | нет | не нужна | 89 | |
| Mobile MCP | нет | не нужна | 10 529 | управляет устройствами на уровне интерфейса без доступа к среде выполнения JS |
| Appium MCP | да | не нужна | 517 | запускает сценарии Appium и не читает логи Metro |
| Chrome DevTools MCP | да | не нужна | 55 126 | отлаживает веб-страницы в Chrome |
Коротко о README
README открывает установкой для Claude Code, Codex, OpenCode и Cursor, затем объясняет принцип подключения к Metro и перечисляет плагины с числом инструментов. Отдельно описаны Chrome DevTools рядом с MCP, строка состояния Claude Code, запись тестов, интеграция с приложением, конфигурация и свои плагины.