Как я запилил Skill для $mol, чтобы Claude Code перестал писать на React
- воскресенье, 22 февраля 2026 г. в 00:00:06
Привет, Хабр! Последние несколько месяцев я пишу на фреймворке $mol. $mol очень крутая штука, но для иишки слишком мало информации в датасетах.
Поставить скил:
npx skills add b-on-g/mol_skill -y -g
Агент постоянно что то да путал, и даже не смотря на типизацию в моле ( даже в css ) это всё очень долго кругами ходило.
Агент:
Путает синтаксис биндингов (<= vs <=>)
Не знает, что $mol_view по умолчанию делает display: flex — и весь контент разъезжается горизонтально
Пишет стили в .css файл вместо типизированного css.ts ( а если пишет то постоянно ошибается )
Понятия не имеет про @$mol_mem и реактивные свойства
Каждый раз приходилось объяснять одно и то же, надоедало но что поделать, я сделал папку с парой мд файлов и скармливах их агенту каждый раз. А потом друг скинул skills.sh
Skill — это, точно такая же папка-репозиторий с файлами, которая и у меня и была, но поделиться с другими ей проще. Аналогичным образом можно создать свой скил
Структура скилла:
~/.claude/skills/mol/ ├── SKILL.md # Точка входа — workflow + триггеры ├── agents/ │ └── openai.yaml # Интерфейс для других агентов └── references/ ├── MOL_QUICK_START.md # Ядро: view.tree, компоненты, стили ├── MOL_GIPER_BAZA_GUIDE.md # Распределённая CRDT-база ├── GIPER_BAZA_ADMIN_GUIDE.md # Паттерны админок └── TAURI_SETUP.md # Десктоп через Tauri
Агент не читает все справочники, а берет только то что нужно для задачи
## 2) Pick the right reference - Use `references/MOL_QUICK_START.md` for core $mol/MAM structure, view.tree syntax, components, best practices. - Use `references/MOL_GIPER_BAZA_GUIDE.md` for data modeling, auth/roles, CRUD, sync. - Use `references/GIPER_BAZA_ADMIN_GUIDE.md` for admin panels, roles, UI patterns. - Use `references/TAURI_SETUP.md` for desktop setup, build, CI.
Сначала читает SKILL.md или yaml, понимает, какой справочник нужен, и подгружает его.
Yaml файл с роутингом + воркфлоу
--- name: mol description: > Build or modify apps with $mol/MAM and related stack. Triggers include queries like "как на моле сделать …", "$mol view.tree", "MAM структура", "Giper Baza CRUD/roles/auth", "Tauri + $mol". ---
LLM аген сам активирует скилл по ключевым словам в запросе. Например при запросах "как на моле сделать список" или "$mol view.tree layout". Я обычно пишу - "подтяни скил мола ... задача..."
Далее алгоритм:
Выбери справочник
Реализуй задачу
Giper Baza — если нужен бэкенд
Валидация — проверяет web.audit.js после билда
Tauri — если нужен десктоп
Содержит:
Структуру проекта — как создать MAM-модуль, что такое index.html, meta.tree, как связаны файлы:
my/app/ ├── index.html # Точка входа ├── app.view.tree # Декларативная вёрстка ├── app.view.ts # Логика ├── app.view.css.ts # Типизированные стили ├── app.test.ts # Тесты └── app.meta.tree # Зависимости
Синтаксис view.tree — DSL, аналог html, но сильно удобнее и практичнее. Пример:
$club_card $mol_view - div по умолчанию post_data null sub / - то что суём в див <= Image $mol_image uri <= cover_image \ - обратный слеш всегда строка <= Content $mol_view -- можно вкладывать до бесконечности sub / <= Title $mol_paragraph title <= post_title \ <= Excerpt $mol_paragraph title <= excerpt_text \ <= Footer $mol_view sub / <= Author $mol_paragraph title <= author_name \ <= Comments $mol_paragraph title <= comments_label \
Правила биндингов:
<= — свойство только для чтения (parent → child)
<=> — двусторонний биндинг (parent ↔ child)
/ — список дочерних элементов
* — словарь (key-value)
null — null
Встроенные компоненты — $mol_button, $mol_search, $mol_text, $mol_page, $mol_list и десятки других.
Так же там я записываю частые проблемы, без них агент раз за разом наступает на одни и те же грабли.
Гипер База - это CRDT-база данных, встроенная в $mol. Данные синхронизируются между клиентами сами, конфликты разрешаются автоматически.
End to end шифрование by default. Безопасно доступно надежно.
Файл описывает:
Иерархию данных: Glob → Land → Node → Unit
Типы полей: atom_text, atom_bint, atom_real, atom_time, list_link_to, dict_to
Криптографическую авторизацию
Систему ролей: deny → read → post → pull → rule
Полные CRUD-паттерны
Как работает prof of work (Pow)
Пример модели/api:
class $my_task extends $giper_baza_entity.with({ title: $giper_baza_atom_text, done: $giper_baza_atom_bint, tags: $giper_baza_list_str, }) {}
Практическое руководство: как построить админку с ролями, CRUD для пользователей и контента, валидацией и экспортом данных. Включает готовые паттерны для:
Иерархии прав (is_super_admin() → is_admin() → is_editor() → is_viewer())
Защищённых действий (protected_action wrapper)
UI-компонентов админки (списки, формы, карточки редактирования)
Как запаковать $mol-приложение в нативное десктопное через Tauri: для сборки под macOS/Windows/Linux/Andriod/IOS. ( привет Dart сообществу :) )
Тут я так же сделал github workflow для быстрого подключения.

Я: Сделай компонент комментария для $mol Claude: Конечно! Вот компонент комментария: $clubСomment $molView sub | <=>> Text $mol_view sub /// <===> text \ Я: Куча ошибок, изучи view.tree там то там то Claude: Извините! Вот: $club_comment $mol_view sub / <= Text $mol_view sub / <= text \ (кривой синтаксис, нет аватара, стили в .css) Я: *тратит 40 минут на правки*
Я: Сделай компонент комментария с аватаром, автором, датой и текстом Claude: [читает SKILL.md → подгружает MOL_QUICK_START.md] club/comment/comment.view.tree: $club_comment $mol_view comment null sub / <= Side $mol_view sub / <= Avatar_link $mol_link arg * user <= author_slug \ sub / <= Avatar $mol_image uri <= avatar_uri \ <= Main $mol_view sub / <= Header $mol_view sub / <= Author $mol_link ... <= Date $mol_paragraph ... <= Body $mol_text text <= comment_text \ club/comment/comment.view.ts: (корректные @$mol_mem свойства, парсинг данных) club/comment/comment.view.css.ts: ($mol_style_define с правильными токенами темы)
Так оно хоть как то работает)
Теперь я пишу приложения чуть быстрее, они всё еще с багами, их всё еще нужно дорабатывать. Например вот вчера накидал formigo - сервис для создания форм. Он глючный)
Репозиторий
Технологии: Claude Code, $mol, MAM, Giper Baza, Tauri