Reproleaf

Один MCP для проверок фронтенда и работы AI-агента

Подключите накопленные правила, воспроизводимые примеры и проверки к своему агенту. Один набор для Vue, React, Three.js, Phaser и HTML — с проверяемым результатом исправления.

Reproleaf / Developer tools / Alpha

Скачать MCP и примеры ↗Сценарии проверок ↓Подключение клиента ↓

От симптома к доказательству исправления

ИИ может изменить CSS, но убедительное исправление требует повторить исходную ошибку и проверить ожидаемое поведение. Каждый кейс содержит симптом, шаги, ограниченный пример, независимое условие проверки и направление исправления. Это инструменты для уже существующих проектов, а не ещё один генератор стартовых шаблонов.

Проверки проекта: история и сравнение

Импортируйте отчёт CLI по адаптеру, сохраните его локально и сравните с повторным запуском. Эта панель не запускает ваше приложение и не сертифицирует его в браузере.

Проект и история

На этом устройстве

Сохраните проект один раз — последующие успешные проверки будут добавляться в историю. Черновики сохраняются кнопкой «Сохранить». Данные привязаны к этому браузеру и адресу сайта, без загрузки на сервер.

История и сравнение проверок

    До 20 проектов и 15 последних проверок в каждом. Очистка браузера или приватный режим могут удалить историю. Экспорт содержит введённые тексты и отчёты: проверяйте файл перед передачей другим людям.

    node src/cli.mjs check --adapter local-page.json

    База проверок внутри одного MCP

    Ищите подходящий симптом или стек. Это примеры и условия проверки, которыми пользуется агент. База расширяется без отдельных установок под каждый фреймворк.

    Проверяемая база примеров. По четыре записи на страницу.

    • vueЗакрытие модального окна

      Кнопка закрытия доступна после прокрутки содержимого.

      modal-close-unreachable

      node src/cli.mjs verify --case modal-close-unreachable

      MCP: get_case и get_case_source возвращают шаги, исходник отдельного примера и ограничения. Проверку запускает ваш локальный агент.

    • reactЛовушка вложенной прокрутки

      Обратный жест возвращает документ к предыдущему разделу.

      nested-scroll-trap

      node src/cli.mjs verify --case nested-scroll-trap

      MCP: get_case и get_case_source возвращают шаги, исходник отдельного примера и ограничения. Проверку запускает ваш локальный агент.

    • threeCanvas после изменения размера

      Сцена покрывает контейнер без незаполненного края.

      canvas-resize-gap

      node src/cli.mjs verify --case canvas-resize-gap

      MCP: get_case и get_case_source возвращают шаги, исходник отдельного примера и ограничения. Проверку запускает ваш локальный агент.

    • phaserЖесты внутри игровой сцены

      Управление canvas не мешает предусмотренной навигации страницы.

      canvas-touch-trap

      node src/cli.mjs verify --case canvas-touch-trap

      MCP: get_case и get_case_source возвращают шаги, исходник отдельного примера и ограничения. Проверку запускает ваш локальный агент.

    1

    Рабочий сценарий с MCP

    1. list_cases: найдите похожий симптом или нужный стек.
    2. get_case и get_case_source: изучите шаги, ограничение и отдельно написанный пример.
    3. Skill mobile-web-review: подготовьте адаптер и запустите CLI на разрешённой странице.
    4. Сохраните наблюдения и проверьте повторно. Ошибка настройки не считается пройденной проверкой.
    node src/cli.mjs skill install --skill mobile-web-review --dest /path/to/project/.agents/skills
node src/cli.mjs check --adapter examples/local-page.json
node src/cli.mjs verify --all

    Для разработчиков, команд и авторов агентов

    Набор полезен, когда ошибка появляется только на узком экране, кнопка уезжает за пределы модалки или жест перехватывается сценой. Чёткое условие и отчёт помогают объяснить исправление ревьюеру и не возвращать тот же баг при следующей правке. Готового специализированного skill на каждый фреймворк пока нет: один сценарий mobile-web-review использует отдельные примеры нужного стека.

    Что означает проверка

    Шесть synthetic-кейсов дают 24 ожидаемые классификации broken/fixed на двух размерах Chromium. Независимый контрольный набор сначала дал 15/16, после исправления — 16/16 на том же наборе. Это регрессия, не новый независимый бенчмарк. Физические Safari/iOS, камера WebGL и польза на неизвестных проектах требуют отдельной проверки.

    Открытый инструмент, приватные исходники

    Кейсы написаны отдельно. Код клиентских проектов, ключи, базы и исходные редакторские документы не публикуются. Можно предложить новый минимальный пример с вымышленными данными и проверяемым ожидаемым поведением.

    Один набор — разные клиенты

    Подключите к своему агенту

    Выберите клиента. SEO-проверки и кейсы фронтенда доступны в одном наборе; конфигурация подключения у каждого клиента своя.

    Codex

    Сначала распакуйте набор, установите Node.js 22+ и выполните npm ci —ignore-scripts в папке набора. Замените пример пути на свой абсолютный путь. Команды добавляют MCP в ваш клиент; браузер их не выполняет.

    codex mcp add reproleaf -- node "C:/tools/reproleaf/src/mcp.mjs"
codex mcp list
    Официальная инструкция ↗

    После подключения попросите агента вызвать list_workflows или list_cases. Для SEO — review_editorial_packet и audit_blog_links; для фронтенда — get_case и get_case_source. Набор не получает автоматически доступ к вашим проектам и не загружает их код.

    Работаете с контентом? Откройте панель проверки SEO и перелинковки.

    Вопросы об инструменте

    Для каких сайтов и стеков подходит Reproleaf?

    Проверка контента принимает Markdown и общий JSON независимо от CMS. Для статических HTML-сборок Astro и других генераторов есть локальный экспортёр. WordPress — один из адаптеров. Проверки интерфейсов используют примеры Vue, React, Three.js, Phaser и обычного HTML.

    Нужен один MCP или отдельный для каждого фреймворка?

    Достаточно одного MCP-сервера Reproleaf. Агент выбирает подходящий workflow, ищет релевантные кейсы и получает инструкции через инструменты этого сервера. Отдельный MCP для Vue, React или SEO не требуется.

    Чем отличаются MCP, skill, API и панель?

    MCP позволяет агенту вызывать проверки и получать материалы. Skill описывает порядок работы и ограничения. API даёт программный доступ к тому же ядру. Панель позволяет работать с данными вручную и получать отчёт. Это разные способы использовать один набор.

    Reproleaf обучен на проектах и гарантирует отсутствие ошибок?

    Это не отдельно обученная модель и не гарантия. В наборе есть обобщённые рабочие правила и отдельно написанные воспроизводимые примеры. Они помогают сформулировать проверку и подтвердить исправление. Применимость к конкретному проекту нужно проверять; ошибки за пределами покрытия могут остаться.

    Исходники моих проектов нужно загружать на сайт?

    Нет. Панель обрабатывает переданный текст и карту страниц в браузере. Локальные CLI и MCP используют предоставленные данные и подготовленные материалы. В публичный набор не входят исходники клиентских проектов, ключи или базы.

    Можно подключить Claude, Codex, Gemini, ChatGPT или Grok?

    Для локальных клиентов доступны инструкции подключения stdio MCP. Веб-клиентам нужен доступный им удалённый MCP endpoint или поддерживаемый туннель. Публичный endpoint Reproleaf пока не опубликован: для таких чатов доступна явная передача отчёта. Смотрите отдельную вкладку нужного клиента.

    Внутри уже работает генеративный ИИ?

    Сейчас структурные проверки выполняет локальное ядро; оно не выдаёт себя за генеративную модель. Отчёт можно передать выбранному AI-чату. Встроенный платный ИИ-разбор через API сайта планируется отдельно, с согласованным провайдером и дневным лимитом; он ещё не включён.

    Как использовать отчёт с командой или клиентом?

    Скачайте JSON для агента или HTML для чтения и печати. HTML указывает Reproleaf как инструмент подготовки. Файл не публикуется автоматически. Перед передачей проверьте, нет ли в отчёте закрытых URL или данных.

    Можно встроить панель на своём сайте?

    Да. Веб-панель можно разместить на собственном статическом HTTPS-хостинге и подключить через iframe. Локальный HTTP API предназначен для ваших интеграций и по умолчанию слушает только 127.0.0.1. Инструкции и примеры входят в архив.

    Плагин автоматически меняет статьи и ставит ссылки?

    Нет. WordPress-адаптер анализирует выгрузку опубликованных материалов в локальной панели админки и может скачать JSON. Он не правит статьи, не заменяет Yoast и не вставляет скрытые обратные ссылки.

    Будет ли база правил расширяться?

    Да, через новые отдельно написанные кейсы с шагами воспроизведения и независимым условием проверки. Каталог с поиском, фильтрами и постраничным выводом не требует раздувать посадочную при добавлении кейсов. Число кейсов само по себе не доказывает качество покрытия.