CC-Viewer

🌐 Site web et visite des fonctionnalités: weiesky.github.io/cc-viewer — disponible en 18 langues.

Une boîte à outils Vibe Coding distillée à partir de l'expérience de développement personnelle, construite sur Claude Code :

1. Élever le plafond des capacités : exécutez /ultraPlan et /ultraReview localement, afin que le code de votre projet n'ait jamais besoin d'être entièrement exposé au cloud de Claude ;
2. Compatibilité multiplateforme : permet la programmation mobile (au sein du LAN) ; la version web s'adapte à divers scénarios, facile à intégrer aux extensions de navigateur et aux vues partagées du système d'exploitation, et fournit un installateur natif ;
3. Journalisation complète : offre des capacités complètes d'interception et d'analyse de la charge utile de Claude Code, idéal pour la journalisation, l'analyse des problèmes, l'apprentissage, l'inspiration et le rétro-ingénierie ;
4. Partage d'apprentissage et d'expérience : de nombreux supports d'apprentissage et expériences de développement ont été accumulés (voir les icônes « ? » dans tout le système) ;
5. Expérience native préservée : étend uniquement les capacités de Claude Code, sans modifications substantielles du noyau, préservant l'expérience native ;
6. Prise en charge des modèles tiers : compatible avec deepseek-v4-*, GLM 5.1, Kimi K2.6, avec la capacité cc-switch intégrée pour commuter à chaud entre les outils tiers à tout moment. La boîte de dialogue de commutation à chaud prend également en charge des sources par rôle — Main Agent, Sub-Agents et Teammates peuvent chacun utiliser un profil de proxy différent (par défaut : suivre le Main Agent) ; lorsque le Main Agent utilise le Default intégré avec l'endpoint officiel, l'attribution des rôles reste masquée et dormante.

English | 简体中文 | 繁體中文 | 한국어 | 日本語 | Deutsch | Español | Français | Italiano | Dansk | Polski | Русский | العربية | Norsk | Português (Brasil) | ไทย | Türkçe | Українська

Config Convergence & Cloud Sync (design doc)

How local config maps to a cloud database and the cloud-sync model (cloud-authoritative, local read-only fallback) is described in Config Convergence & Cloud-Sync Advisory (中文). This is a proposal, not yet implemented.

Reverse-proxy base URL (CCV_BASE_URL): docs/base-url.md (中文) — serve cc-viewer under a public URL path prefix (Host allowlist, WS upgrades, share/QR links follow automatically).

Utilisation

Prérequis

• Assurez-vous d'avoir Node.js 20.0.0+ installé ; Télécharger et installer
• Assurez-vous d'avoir Claude Code installé ; Tutoriel d'installation

Installer ccv

Installation via npm

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

Installation via Homebrew (recommandé pour macOS / Linux)

brew tap weiesky/cc-viewer
brew install cc-viewer
brew upgrade cc-viewer   # pour les mises à jour — n'utilisez PAS npm install -g avec les installations brew

Installation via pnpm (global)

pnpm add -g cc-viewer
pnpm add -g cc-viewer@latest   # pour les mises à jour — n'utilisez PAS npm install -g avec les installations pnpm

Lancement

ccv est un remplacement direct de claude — tous les arguments sont transmis à claude tout en lançant le Web Viewer.

ccv                    # == claude (mode interactif)

La commande que l'auteur lui-même utilise le plus souvent est :

ccv -c --d             # == claude --continue --dangerously-skip-permissions
                       # ccv transmet tous les paramètres de démarrage de Claude Code — vous pouvez les combiner comme vous le souhaitez

Après le démarrage en mode programmation, une page web s'ouvrira automatiquement.

cc-viewer est également distribué en tant qu'application de bureau native : Page de téléchargement

Mode SDK (headless, ccv --sdk)

ccv --sdk exécute la session via le Agent SDK au lieu d'un terminal interactif — pas de PTY principal ; les messages sont envoyés depuis l'interface web, et tout le reste (journaux de session, effet machine à écrire en streaming, statistiques d'utilisation) fonctionne comme en mode terminal. L'en-tête expose toujours un bouton Terminal, mais il ouvre un shell brouillon autonome à plusieurs onglets (sans rapport avec la session SDK), et non un PTY de projet.

ccv --sdk                # session headless ; discutez depuis le navigateur
ccv --sdk -c             # continue la session la plus récente
ccv --sdk --model sonnet # choisissez un modèle

Les approbations (Bash/Edit/Write/WebFetch/…) s'affichent dans le navigateur avec autoriser / refuser / autoriser pour la session, et les invites AskUserQuestion / plan apparaissent sous forme de modales. npm publish exige toujours une approbation explicite — même avec --d. Nécessite le paquet @anthropic-ai/claude-agent-sdk (inclus avec cc-viewer) ; sinon, retombe en mode terminal.

Mise à niveau vers 1.7.0 (format de log v2)

Depuis la version 1.7.0, les logs sont stockés dans un format de répertoire par session (wire-format v2) au lieu de fichiers .jsonl uniques — environ 90 % d'espace disque en moins. Les fichiers .jsonl v1 existants ne sont jamais modifiés ni supprimés ; la boîte de dialogue des logs affiche par défaut les sessions v2, et une petite entrée « Afficher les logs hérités (v1) » (visible tant que d'anciens fichiers existent) ouvre une vue v1 où ils peuvent être consultés, migrés ou supprimés. Au démarrage, cc-viewer propose une migration en un clic lorsque des logs hérités sont détectés (fortement recommandée lorsque vous poursuivez une ancienne conversation avec claude -c, dont la première moitié réside dans les anciens fichiers). Vous pouvez également migrer depuis le terminal :

ccv convert <project>   # migrer un projet
ccv convert --all       # migrer tous les projets
ccv verify <v1-file>    # vérifier un fichier v1 par rapport à ses sessions converties

Si une session échoue à la vérification golden, elle est mise de côté dans sessions-quarantine/ pour inspection au lieu de faire échouer toute la migration — les autres sessions sont tout de même migrées.

Mode Logger

Si vous préférez toujours l'outil natif claude ou l'extension VS Code, utilisez ce mode.

Dans ce mode, le démarrage de claude

lancera automatiquement un processus de journalisation qui enregistre les journaux de requêtes dans des répertoires par session sous ~/.claude/cc-viewer/yourproject/sessions/ (wire-format v2)

Activer le mode logger :

ccv -logger

Lorsque la console ne peut pas imprimer le port spécifique, le premier port par défaut est 127.0.0.1:7008. Les instances multiples utilisent des ports séquentiels comme 7009, 7010.

Désinstaller le mode logger :

ccv --uninstall

Dépannage (Troubleshooting)

Si vous rencontrez des problèmes au démarrage de cc-viewer, voici l'approche ultime pour le dépannage : Étape 1 : Ouvrez Claude Code dans n'importe quel répertoire. Étape 2 : Donnez à Claude Code l'instruction suivante :

J'ai installé le package npm cc-viewer, mais après avoir exécuté ccv, il ne fonctionne toujours pas correctement. Veuillez consulter cli.js et findcc.js de cc-viewer, et les adapter au déploiement local de Claude Code en fonction de l'environnement spécifique. Limitez autant que possible la portée des modifications à findcc.js.

Laisser Claude Code diagnostiquer lui-même le problème est plus efficace que de demander à quiconque ou de lire n'importe quelle documentation !

Une fois l'instruction ci-dessus terminée, findcc.js sera mis à jour. Si votre projet nécessite fréquemment un déploiement local, ou si le code forké doit souvent résoudre des problèmes d'installation, conserver ce fichier vous permet simplement de le copier la prochaine fois. À l'heure actuelle, de nombreux projets et entreprises utilisant Claude Code ne déploient pas sur Mac mais dans des environnements hébergés côté serveur, c'est pourquoi l'auteur a séparé le fichier findcc.js pour faciliter le suivi des mises à jour du code source de cc-viewer à l'avenir.

Remarque : cette application est en conflit avec claude-code-switch et claude-code-router en raison de la concurrence de proxy, donc lors de son utilisation, assurez-vous de fermer claude-code-switch et claude-code-router. cc-viewer inclut une capacité de mise à jour à chaud du proxy en remplacement équivalent.

Autres commandes auxiliaires

Consultez :

ccv -h

Mode silencieux (Silent Mode)

Par défaut, ccv s'exécute en mode silencieux lorsqu'il enveloppe claude, gardant la sortie du terminal propre et cohérente avec l'expérience native. Tous les journaux sont capturés en arrière-plan et peuvent être consultés sur http://localhost:7008.

Une fois configuré, utilisez la commande claude normalement. Visitez http://localhost:7008 pour accéder à l'interface de surveillance.

Fonctionnalités

Tâches planifiées

Ouvrez Tâches planifiées depuis le menu (+) (barre de saisie du chat ou barre d'outils du terminal) pour exécuter un prompt selon un horaire : un préréglage (horaire/quotidien/jours ouvrés/hebdomadaire), un cron personnalisé à 5 champs ou une heure unique. Une tâche injecte le prompt dans la session courante ou démarre une nouvelle session headless isolée (mode SDK uniquement). Les tâches sont stockées par projet et planifiées dans le fuseau horaire du serveur avec un léger jitter ; un verrou de fichier inter-processus évite les doubles exécutions et, après un redémarrage ou une mise en veille, la dernière exécution manquée est rattrapée dans les 7 jours. Vous pouvez Exécuter maintenant, suspendre/reprendre, supprimer et voir les 20 dernières exécutions. Remarque : une tâche ne s'exécute que lorsque ccv est en cours.

Mode Programmation

Après le démarrage avec ccv, vous pouvez voir :

Vous pouvez voir les différences de code directement après l'édition :

Bien que vous puissiez ouvrir des fichiers et coder manuellement, la programmation manuelle n'est pas recommandée — c'est une programmation à l'ancienne !

Programmation mobile

Vous pouvez même scanner un code QR pour programmer depuis votre appareil mobile :

Réalisez votre imagination de la programmation mobile. Il existe également un mécanisme de plugins — si vous avez besoin de personnaliser selon vos habitudes de codage, surveillez les mises à jour des hooks de plugins.

Prompts système par modèle

La fenêtre modale Modifier le prompt système (menu hamburger → Modifier le prompt système) est organisée en onglets :

• Onglet Défaut : écrit CC_SYSTEM.md (remplacer) ou CC_APPEND_SYSTEM.md (ajouter) dans l'espace de travail, injecté au prochain lancement de ccv.
• Onglets de modèle : ajoutez un modèle par nom (opus, Gemini3, …) avec une portée Global (~/.claude/cc-viewer/system_prompt/) ou Espace de travail (<project>/system_prompt/) ; chaque onglet a son propre commutateur Ajouter/Remplacer et son aperçu. Les noms correspondent de façon approximative à l'ID de modèle résolu (opus correspond à claude-opus-4-8[1m]) ; l'espace de travail l'emporte sur global, le nom le plus long gagne, une entrée correspondante remplace entièrement les fichiers par défaut.
• Préréglages intégrés : des system prompts ajustés, profondément adaptés aux familles de modèles Kimi, DeepSeek, Qwen et GLM — injectés automatiquement lorsque le modèle résolu correspond et qu'aucune de vos entrées ne correspond (vos fichiers gagnent toujours). Désactivation via le × de l'onglet.
• Le texte système suit les bascules à chaud du modèle principal en cours de session, figé par (session, modèle) (KV-cache invalidé une seule fois au changement). Enregistrer un onglet vide supprime l'entrée. CCV_DISABLE_AUTO_SYSTEM_PROMPT=1 désactive toute injection automatique, CCV_DISABLE_LIVE_SYSTEM_PROMPT=1 uniquement le suivi en cours de session.

Mode Logger (Visualiser les sessions complètes de Claude Code)

• Capture toutes les requêtes API de Claude Code en temps réel, garantissant le texte brut — pas de journaux censurés (c'est important !!!)
• Identifie et étiquette automatiquement les requêtes Main Agent et Sub Agent (sous-types : Plan, Search, Bash)
• Les requêtes MainAgent prennent en charge Body Diff JSON, affichant les différences pliées par rapport à la requête MainAgent précédente (uniquement les champs modifiés/nouveaux)
• Chaque requête affiche les statistiques d'utilisation des Token en ligne (Tokens d'entrée/sortie, création/lecture de cache, taux de succès)
• Compatible avec Claude Code Router (CCR) et autres scénarios de proxy — recourt au modèle de chemin API

<source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/chart?repos=weiesky/cc-viewer&type=date&legend=top-left" />

![Star History Chart](https://api.star-history.com/chart?repos=weiesky/cc-viewer&type=date&legend=top-left)

License

MIT