Vibe MCP
Vibe MCP отдает агенту компоненты, иконки и токены дизайн-системы monday.com Vibe
- 692 ★ репозитория
- Последний коммит
Расширенный доступ
Почему такой уровень
- Запускается из npm командой npx и выполняется на вашей машине с правами редактора
- Инструменты миграции читают файлы проекта, чтобы найти использование компонентов Vibe
Установка
- Работает в
В терминале, через SkillFoxx CLI
npx skillfoxx add mcp/vibe-mcpОпределит агенты на машине, покажет уровень доступа и зафиксирует версию.
Другие способы установки
Доступ и проверки
Как мы проверяемРасширенный доступИнструмент запускает код или ходит в сеть, а внешние данные только читает.
- Запускается из npm командой npx и выполняется на вашей машине с правами редактора
- Инструменты миграции читают файлы проекта, чтобы найти использование компонентов Vibe
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
Vibe MCP — локальный сервер для тех, кто верстает на React с дизайн-системой Vibe от monday.com. Агент спрашивает у него метаданные компонентов из @vibe/core, примеры использования на React, требования доступности, иконки из @vibe/icons и токены из @vibe/style, вместо того чтобы угадывать пропсы по памяти. Список иконок и токенов можно сузить по тексту запроса и категории. Для перехода между версиями Vibe есть инструменты миграции. Каждый сканирует проект, находит ломающие изменения и устаревшие компоненты, затем выдает готовые команды codemod и отчет с рекомендациями. Сервер запускается командой npx @vibe/mcp и работает по stdio без ключей и входа. Для Cursor есть кнопка установки, для VS Code ссылка vscode://mcp-server/add.
Для кого. Для фронтенд-разработчиков, которые пишут интерфейсы на Vibe и просят Cursor, Claude Code или Copilot подбирать компоненты, иконки и токены и вести обновление версий.
Подходит, если
- Агент подбирает компонент и должен знать его пропсы: `get-vibe-component-metadata` отдает их
- Нужен рабочий пример на React для кнопки, диалога или выпадающего списка: `get-vibe-component-examples`
- Надо проверить требования доступности компонента перед ревью интерфейса: `get-vibe-component-accessibility`
- Нужна иконка по слову вроде «календарь» или токен отступов: `list-vibe-icons` и `list-vibe-tokens` фильтруют по запросу и категории
- Проект переезжает с Vibe 2 на 3, с 3 на 4 или на новый Dropdown, и нужен список ломающих изменений с командами codemod
Не подходит, если
- Проект не использует Vibe и @vibe/core: сервер знает только эту дизайн-систему
- Нужно работать с досками, элементами и колонками monday.com: этим занимается отдельный MCP-сервер monday.com
- Вы ждете, что сервер сам применит миграцию: он выдает команды codemod, а запускаете их вы или агент в терминале
Пример запроса к агенту
Мне нужна кнопка с состоянием загрузки на компонентах Vibe: найди нужный компонент, покажи пример и напомни требования доступностиMCP
- Транспорт
- stdio
- Авторизация
- не нужна
Ограничения
- Нужен Node.js, сервер запускается через npx. Работает локально, ключей и аккаунта не просит.
- Сервер входит в монорепозиторий дизайн-системы Vibe, отдельного репозитория у него нет, версия пакета @vibe/mcp ведется отдельно.
- В README пакета назван один инструмент миграции, v3-migration, а страница документации Vibe добавляет v4-migration и dropdown-migration, поэтому набор инструментов зависит от версии пакета.
- Знает только Vibe: компоненты других дизайн-систем и обычный HTML он не описывает.
Как отключить. Удалите запись vibe из ~/.cursor/mcp.json или .vscode/mcp.json и перезапустите редактор. Проект и пакеты @vibe/core остаются как были, потому что сервер ничего в них не устанавливает.
Частые вопросы
Как подключить Vibe MCP к Cursor?
Нажмите кнопку Install MCP Server в документации Vibe или впишите в ~/.cursor/mcp.json сервер vibe с командой npx и аргументами -y и @vibe/mcp. После перезапуска Cursor в чате станут доступны инструменты вроде `get-vibe-component-metadata`.
Как поставить Vibe MCP в VS Code?
Откройте в браузере ссылку vscode://mcp-server/add с готовой конфигурацией из документации или создайте .vscode/mcp.json. В VS Code ключ верхнего уровня называется servers, команда прежняя: npx -y @vibe/mcp.
Как мигрировать проект с Vibe 3 на Vibe 4 через агента?
Попросите агента помочь с миграцией, и он вызовет v4-migration. Инструмент просканирует проект, найдет использование компонентов, отметит ломающие изменения и выдаст команды codemod с отчетом. Для старых версий есть v3-migration, для нового Dropdown `dropdown-migration`.
Какие инструменты есть в Vibe MCP?
Для компонентов: `get-vibe-component-metadata`, `list-vibe-public-components`, `get-vibe-component-examples` и `get-vibe-component-accessibility`. Для иконок `list-vibe-icons`, для токенов `list-vibe-tokens`. Для миграций v3-migration, а по документации еще v4-migration и `dropdown-migration`.
Нужен ли для Vibe MCP токен monday.com?
Нет. Сервер работает локально через npx, читает метаданные дизайн-системы из своих пакетов и ничего не берет из вашего аккаунта monday.com.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
MCP-серверыПлагин Vite с MCP-сервером: агент видит компоненты, маршруты и хранилища Pinia запущенного Vue-приложения
Nuxt MCP Dev
nuxt-mcp-dev / vite-plugin-mcp
Модуль Nuxt и плагин Vite поднимают MCP-сервер на порту dev-сервера: агент видит конфигурацию, страницы, компоненты, автоимпорты и граф модулей
MCP-сервер и плагин 21st.dev: поиск готовых React/Tailwind компонентов, логотипов и генерация интерфейса прямо из агента
Inspo
inspo
Сервер MCP со справочником реальных рабочих сайтов, по которым агент изучает дизайн до написания интерфейса. Брать приемы, не копировать страницы
Shadcn UI MCP Server
Shadcn UI v4 MCP Server
MCP-сервер, который отдает агенту исходники, демо и блоки компонентов shadcn/ui для React, Svelte, Vue и React Native
MCP-сервер и скилл для набора из тысяч брендовых SVG-иконок: агент ищет и вставляет иконки без ключа
Сравнение с похожими
Записи с тем же главным запросом: чем они отличаются.
| Запись | Официальный | Авторизация | Звезды репозитория | Главное отличие |
|---|---|---|---|---|
| Vibe MCP (эта запись) | да | не нужна | 692 | |
| Design System Extractor MCP | нет | не нужна | 72 | достает компоненты и токены из Storybook любого проекта, а Vibe MCP знает только дизайн-систему Vibe и умеет вести миграции ее версий |
| Shadcn UI MCP Server | нет | ключ необязателен | 3 073 | отдает исходники и демо компонентов shadcn/ui, к Vibe отношения не имеет |
Коротко о README
README пакета @vibe/mcp начинается с кнопки установки для Cursor и ссылки для VS Code с примерами JSON-конфигурации. Затем идут инструменты по группам: компоненты, иконки, токены, миграция. Страница MCP в документации Vibe шире: на ней есть v4-migration и dropdown-migration, примеры запросов к агенту и перечень выгод.