CC-Viewer

🌐 Сайт та огляд можливостей: weiesky.github.io/cc-viewer — доступно 18 мовами.

Інструмент Vibe Coding, побудований на основі Claude Code, у якому дистильовано власний досвід розробки:

Підвищення меж можливостей — запускайте /ultraPlan та /ultraReview локально, водночас уникаючи повного розкриття коду проєкту у хмарі Claude;
Адаптація до багатьох пристроїв — програмуйте з мобільного пристрою (у локальній мережі), вебверсія адаптується до різних сценаріїв, легко вбудовується у браузерні розширення чи розділений екран ОС, також доступний нативний інсталятор;
Повне збереження логів — повне перехоплення та аналіз payload Claude Code, ідеально для логування, налагодження, навчання та зворотної розробки;
Обмін навчальним досвідом — накопичено багато навчальних матеріалів і досвіду розробки (шукайте іконки «?» у різних місцях системи);
Збереження нативного досвіду — лише розширює можливості Claude Code без жодних суттєвих змін у ядрі, зберігаючи нативний досвід;
Підтримка сторонніх моделей — сумісний з deepseek-v4-*, GLM 5.1, Kimi K2.6, вбудована функціональність cc-switch дозволяє перемикати сторонні інструменти на льоту;

Використання

Передумови

Переконайтеся, що встановлено nodejs 20.0.0+; Завантажити та встановити
Переконайтеся, що встановлено claude code; Посібник з установлення

Встановлення ccv

Встановлення через npm

npm install -g cc-viewer --registry=https://registry.npmjs.org

Встановлення через Homebrew (рекомендовано для macOS / Linux)

brew tap weiesky/cc-viewer
brew install cc-viewer
brew upgrade cc-viewer   # для оновлення використовуйте саме це; ccv, встановлений через brew, не оновлюйте через npm install -g

Спосіб запуску

ccv — це прямий замінник claude: усі аргументи передаються до claude, водночас запускається Web Viewer.

ccv                    # == claude (інтерактивний режим)

Найчастіше автор використовує таку команду:

ccv -c --d             # == claude --continue --dangerously-skip-permissions
                       # ccv передає всі аргументи запуску claude code — комбінуйте їх як завгодно

Після запуску в режимі програмування вебсторінка відкриється автоматично.

cc-viewer також постачається як клієнтська версія: Сторінка завантаження

Оновлення до 1.7.0 (формат логів v2)

Починаючи з версії 1.7.0, логи зберігаються у форматі каталогу на кожну сесію (wire-format v2) замість окремих файлів .jsonl — це приблизно на 90% менше місця на диску. Наявні файли .jsonl v1 ніколи не змінюються й не видаляються; діалог логів за замовчуванням показує сесії v2, а невеликий пункт «Показати застарілі логи (v1)» (відображається, доки існують старі файли) відкриває подання v1, де їх можна переглянути, мігрувати або видалити. Під час запуску cc-viewer пропонує міграцію в один клік, коли знаходить застарілі логи (наполегливо рекомендовано під час продовження старої розмови командою claude -c, перша половина якої зберігається у старих файлах). Мігрувати можна й із терміналу:

ccv convert <project>   # мігрувати один проєкт
ccv convert --all       # мігрувати всі проєкти
ccv verify <v1-file>    # перевірити файл v1 щодо його сконвертованих сесій

Якщо сесія не проходить golden-перевірку, її відкладають у sessions-quarantine/ для перевірки замість того, щоб зривати всю міграцію — решта сесій мігрує як звичайно.

Режим логування

Якщо ви все ще звикли користуватися нативним інструментом claude або розширенням VS Code, використовуйте цей режим.

У цьому режимі запуск claude

автоматично запустить процес логування, який записуватиме логи запитів до каталогів на кожну сесію в ~/.claude/cc-viewer/yourproject/sessions/ (wire-format v2)

Увімкнення режиму логування:

ccv -logger

Коли консоль не може вивести конкретний порт, за замовчуванням першим портом запуску є 127.0.0.1:7008. За одночасної наявності кількох екземплярів порти продовжуються по черзі — 7009, 7010 тощо.

Видалення режиму логування:

ccv --uninstall

Усунення поширених проблем (Troubleshooting)

Якщо у вас виникли проблеми із запуском, є остаточний спосіб розв'язання: Крок 1: Відкрийте claude code у будь-якому каталозі; Крок 2: Дайте claude code інструкцію такого змісту:

我已经安装了cc-viewer这个npm包，但是执行ccv以后仍然无法有效运行。查看cc-viewer的cli.js 和 findcc.js，根据具体的环境，适配本地的claude code的部署方式。适配的时候修改范围尽量约束在findcc.js中。

Дозволити Claude Code самому перевіряти помилки — це ефективніше за консультації будь-кого та читання будь-якої документації!

Після виконання вищевказаної інструкції findcc.js буде оновлено. Якщо ваш проєкт часто потребує локального розгортання або якщо форкнутому коду часто доводиться розв'язувати проблеми з установленням, збереження цього файлу буде доцільним. Наступного разу його можна просто скопіювати. На цьому етапі багато проєктів і компаній, що використовують claude code, розгортають його не на mac, а на хостингу серверних середовищ, тому автор виокремив файл findcc.js, щоб надалі було легше відстежувати оновлення вихідного коду cc-viewer.

Примітка: цей застосунок конфліктує з claude-code-switch та claude-code-router через конкуренцію за proxy, тому при використанні обов'язково вимкніть claude-code-switch та claude-code-router; усередині cc-viewer надається функція гарячого оновлення проксі як рівноцінна заміна.

Інші допоміжні команди

Перегляд:

ccv -h

Тихий режим (Silent Mode)

За замовчуванням ccv під час обгортання claude перебуває в тихому режимі, забезпечуючи чистий вивід терміналу та узгодженість із нативним досвідом. Усі логи захоплюються у фоновому режимі та доступні для перегляду за адресою http://localhost:7008.

Після налаштування використовуйте команду claude як зазвичай. Відвідайте http://localhost:7008 для доступу до інтерфейсу моніторингу.

Можливості

Режим програмування

Після запуску за допомогою ccv ви побачите:

Ви можете переглядати diff коду одразу після завершення редагування:

Хоча ви можете відкривати файли і програмувати вручну, ручне програмування не рекомендоване — це старомодне програмування!

Мобільне програмування

Ви навіть можете відсканувати QR-код, щоб програмувати з мобільного пристрою:

Втілюйте свою уяву про мобільне програмування. Крім того, існує механізм плагінів — якщо вам потрібно налаштувати все під власні звички програмування, слідкуйте за оновленнями hooks для плагінів.

Системні промпти для окремих моделей

Модальне вікно Редагувати системний промпт (гамбургер-меню → Редагувати системний промпт) поділене на вкладки:

Вкладка За замовчуванням зберігає класичну поведінку: вона записує CC_SYSTEM.md (перевизначення) або CC_APPEND_SYSTEM.md (додавання) у поточний робочий простір; файл впроваджується як --system-prompt-file / --append-system-prompt-file під час наступного запуску ccv.
Вкладки моделей: натисніть + Додати модель, введіть назву, наприклад opus чи Gemini3, і виберіть область — Глобально (~/.claude/cc-viewer/system_prompt/, застосовується до всіх робочих просторів) або Робочий простір (<project>/system_prompt/). Кожна вкладка має власний перемикач «Додати/Перевизначити» та попередній перегляд Markdown.
Записи зберігаються як файли з назвами у верхньому регістрі: OPUS_SYSTEM.md (перевизначення) або OPUS_APPEND_SYSTEM.md (додавання). Зіставлення нечітке — шукається нечутливий до регістру підрядок ідентифікатора моделі, визначеного з АКТИВНОЇ конфігурації (зіставлення моделі активного стороннього proxy profile > змінні середовища ANTHROPIC_MODEL/CLAUDE_MODEL під час запуску > model із settings.json; без сигналу конфігурації запис не впроваджується), тож opus збігається з claude-opus-4-8[1m] незалежно від версії. Збіг у робочому просторі має пріоритет над глобальним; у межах однієї області перемагає найдовша назва; знайдений запис повністю замінює файли «За замовчуванням» для цього запуску. Відомі обмеження: зміна proxy profile посеред сесії враховується лише після перезапуску сесії claude; прапорець --model, переданий через додаткові аргументи, не береться до уваги.
Збереження порожньої вкладки видаляє запис. Зміна моделі посеред сесії набуває чинності після наступного перезапуску. Встановіть CCV_DISABLE_AUTO_SYSTEM_PROMPT=1, щоб вимкнути будь-яке автоматичне впровадження. Каталог <project>/system_prompt/ можна закомітити, щоб ділитися промптами з командою, або додати до .gitignore, щоб зберегти їх приватними.

Режим логування (перегляд повної сесії claude code)

Захоплення всіх API-запитів від Claude Code у реальному часі — гарантується оригінал, а не урізані логи (це дуже важливо!!!)
Автоматичне розпізнавання та маркування запитів Main Agent і Sub Agent (підтипи: Plan, Search, Bash)
Запити MainAgent підтримують Body Diff JSON — відмінності від попереднього запиту MainAgent показуються згорнутими (лише змінені/нові поля)
Кожен запит відображає вбудовану статистику використання Token (вхідні/вихідні Token, створення/читання кешу, частота влучань)
Сумісність із Claude Code Router (CCR) та іншими проксі-сценаріями — резервне зіставлення запитів за шаблонами шляху API

License

MIT

FilesExpand file tree

README.uk.md

Latest commit

History