Skip to content

Вайб-кодинг со Startup UI

Startup UI спроектирован под сборку интерфейсов промптами: ты описываешь ИИ-агенту задачу, а он верстает (и правит) экраны из готовых S-компонентов — единообразно и по правилам библиотеки. Чтобы агент использовал компоненты правильно, а не выдумывал API, документация отдаётся в машинно-читаемом виде, и агент разбирается в ней сам.

Тебе как человеку ничего вручную искать, дописывать .md к ссылкам или копировать в промпт не нужно — достаточно работать в проекте или один раз упомянуть библиотеку.

Сценарий 1. Агент работает в проекте, где установлен Startup UI

Главный случай — агент разбирается сам, без твоих действий и даже без упоминания библиотеки. Документация едет внутри npm-пакета и привязана к установленной версии (работает оффлайн):

  • node_modules/startup-ui/README.md и AGENTS.md — точка входа с правилами использования;
  • node_modules/startup-ui/llms/llms.txt — индекс всех компонентов;
  • node_modules/startup-ui/llms/components/<категория>/<имя>.md — полная спецификация компонента (пропсы, слоты, примеры).

Встретив незнакомый импорт import { SButton } from 'startup-ui', современные кодинг-агенты (Claude Code, Cursor, Copilot и др.) заглядывают в пакет — читают package.json, README, типы — и оттуда попадают на спеки в llms/.

Чтобы это работало гарантированно

Агенты читают AGENTS.md / CLAUDE.md из корня проекта, а не из node_modules. Добавь туда один раз короткий указатель — и агент держит библиотеку в контексте всегда, ещё до того как полезет в код:

md
## Startup UI
Проект использует библиотеку компонентов `startup-ui` (все компоненты с префиксом `S`).
Перед версткой UI читай правила и спеки внутри пакета:
`node_modules/startup-ui/AGENTS.md`, индекс — `node_modules/startup-ui/llms/llms.txt`.

Claude Code не читает AGENTS.md — положи эту вставку в корневой CLAUDE.md (внутри самого пакета шим CLAUDE.md@AGENTS.md уже есть).

Сценарий 2. Ты упомянул библиотеку агенту или чату

Тогда агент сам сходит за документацией онлайн (или найдёт её по адресу startup-ui.ru). При желании дай прямую ссылку:

  • /llms.txt — компактный индекс всех компонентов по стандарту llmstxt.org;
  • /llms-full.txt — вся документация одним файлом, когда нужен полный контекст;
  • /llms/rules.txt — короткие правила для системной инструкции редактора.

Как это устроено под капотом

Каждая страница доков доступна в чистом Markdown — к любому её URL дописывается .md (например, startup-ui.ru/pages/components/interfaces/sbutton.md). Это техническая деталь: ею пользуются сами агенты и llms.txt. Вручную дописывать .md и копировать текст в промпт не нужно — это забота агента, а не твоя.

Что дальше

Самый автономный вариант — MCP-сервер: агент запрашивает компоненты, пропсы и примеры вживую, без ручных ссылок. Он на отдельной дорожке развития; вся машинно-читаемая база под него уже готова.