medula MCP
Плагин для Vite, Nuxt и Next.js открывает агенту состояние запущенного приложения на Vue, React, Svelte или Solid через MCP.
- 127 ★ репозитория
- Последний коммит
- MIT
Расширенный доступ
Почему такой уровень
- Агент читает и меняет состояние запущенного приложения, включая данные хранилищ и props.
Установка
- Работает в
В терминале, через SkillFoxx CLI
npx skillfoxx add mcp/medulaОпределит агенты на машине, покажет уровень доступа и зафиксирует версию.
Другие способы установки
Доступ и проверки
Как мы проверяемРасширенный доступИнструмент запускает код или ходит в сеть, а внешние данные только читает.
- Агент читает и меняет состояние запущенного приложения, включая данные хранилищ и props.
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
medula подключается к dev-серверу приложения и дает кодирующему агенту смотреть и менять внутреннее состояние живой страницы через MCP. Поддерживаются Vue 3, React, Svelte 5 и Solid, сборщики Vite и Nuxt, а также Next.js с App Router. В Vue агент читает дерево компонентов, состояние и хранилища Pinia и переходит по маршрутам Vue Router. В React он видит компоненты, состояние хуков и подменяет props. В Svelte правит `$state`, в Solid читает сигналы и хранилища. Изменения касаются открытой страницы и в исходники не попадают. Вызов `medula_help` подсказывает агенту доступные инструменты.
Для кого. Фронтенд-разработчики на Vue, React, Svelte и Solid, которые проверяют исправления в браузере вместе с агентом.
Подходит, если
- Агент исправил баг, и нужно проверить результат на живой странице, не пересобирая сценарий руками.
- Редкое состояние сложно воспроизвести автотестом, например количество 3 в корзине.
- Агенту надо показать дерево компонентов и их текущие данные.
- В приложении на Vue нужно проверить переход по маршруту через Vue Router.
Не подходит, если
- Отладка идет на продакшене: плагин работает только в dev-режиме.
- Приложение написано на фреймворке вне списка: Angular и другие не поддерживаются.
- Нужно править исходники: medula меняет состояние страницы, а не файлы.
Пример запроса к агенту
Покажи компоненты на этой странице и их состояние, затем поставь количество товара в корзине равным 3, чтобы я проверил итог.MCP
- Транспорт
- stdio
- Авторизация
- не нужна
Ограничения
Плагин работает только во время разработки и подключается к dev-серверу. Вкладку с приложением нужно держать открытой и видимой, пока агент работает; если devtools просит код подключения, его вводят вручную. Для Vite нужен Vite 8 с Vite DevTools, для Nuxt — Nuxt DevTools 4. Поддержка Solid 2 проверена на версии 2.0.0-rc.13. В Next.js настройка `auth: false` в README рекомендована для локальной работы на машине одного пользователя, на общем сервере ее оставлять нельзя. Состояние страницы меняется напрямую, поэтому после проверки перезагрузите вкладку.
Как отключить. Уберите `medula()` из плагинов Vite или модуль `medula/nuxt` из конфигурации Nuxt, удалите пакет и запись `devframe` из MCP-конфигурации агента.
Частые вопросы
Какие фреймворки поддерживает medula?
Vue 3, React, Svelte 5 и Solid 1.9 или 2 RC. Интеграции есть для Vite, Nuxt и Next.js.
Как подключить агента к medula?
Добавьте в MCP-конфигурацию сервер `devframe` с командой `npx` и аргументами `devframe connect`. Команда сама находит все запущенные dev-серверы.
Меняет ли medula исходный код?
Нет. Изменения касаются только запущенной страницы, файлы проекта остаются прежними.
Что делать, если инструменты не появились?
Запустите dev-сервер, откройте приложение в браузере и оставьте вкладку видимой. Если devtools просит код подключения, введите его.
Нужно ли менять код приложения?
Нет. `medula()` добавляют в конфигурацию сборщика, и инструмент подключается к приложению без правок в компонентах.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
MCP-серверыПлагин Vite с MCP-сервером: агент видит компоненты, маршруты и хранилища Pinia запущенного Vue-приложения
Nuxt MCP Dev
nuxt-mcp-dev / vite-plugin-mcp
Модуль Nuxt и плагин Vite поднимают MCP-сервер на порту dev-сервера: агент видит конфигурацию, страницы, компоненты, автоимпорты и граф модулей
Подключает агента к запущенному dev-серверу Next.js 16+: ошибки, маршруты, логи и путь к документации нужной версии
MCP-сервер Vuetify: агент берет из него API компонентов, гайды, заметки к релизам и план перехода с версии 2 на 3
Связывает запущенный фронтенд с агентом: клик по элементу ведет к строке кода, а агент видит живой DOM, пропсы и состояние.
Официальный MCP-сервер и плагин Svelte: актуальная документация, автоисправление компонентов и скиллы по Svelte 5
Сравнение с похожими
Карточки с тем же главным запросом: чем они отличаются.
| Инструмент | Официальный | Авторизация | Звезды репозитория | Главное отличие |
|---|---|---|---|---|
| medula (эта карточка) | нет | не нужна | 127 | |
| agent-react-devtools | нет | 252 | ограничен React; medula покрывает Vue, Svelte и Solid и подключается к dev-серверу | |
| Chrome DevTools MCP | да | не нужна | 55 199 | управляет браузером через DevTools Protocol; medula читает состояние компонентов и хранилищ внутри фреймворка |
Коротко о README
Описаны настройка для Vite, Nuxt и Next.js, MCP-запись для агента и примеры запросов. Для каждого фреймворка перечислено, что агент читает и меняет.