Aller au contenu principal

Oh My Posh rencontre Claude Code : Des invites de terminal propulsées par l'IA

· 6 min de lecture
Traduction Bêta Non Officielle

Cette page a été traduite par PageTurner AI (bêta). Non approuvée officiellement par le projet. Vous avez trouvé une erreur ? Signaler un problème →

La personnalisation du terminal vient de gagner en intelligence. Oh My Posh s'intègre désormais à Claude Code via sa fonctionnalité statusline, affichant en temps réel les informations de session d'IA et le contexte de développement directement dans votre prompt Claude Code. Ce n'est pas un simple segment supplémentaire : c'est un pont entre votre flux de travail de développement et l'assistance au codage par IA.

Interface Claude Code

Qu'est-ce que la statusline de Claude Code ?

La fonction statusline de Claude Code vous permet de créer des affichages d'état personnalisés apparaissant en bas de l'interface Claude Code, de manière similaire aux invites de terminal dans les shells. La statusline reçoit des données JSON détaillées sur votre session d'IA actuelle via stdin, notamment :

  • Informations sur le modèle : Quel modèle Claude vous utilisez (Claude Sonnet, Claude Opus, etc.)

  • Utilisation des tokens : Tokens d'entrée/sortie, taux d'utilisation de la fenêtre de contexte

  • Suivi des coûts : Calculs en temps réel et durée de session

  • Contexte de l'espace de travail : Répertoires courant et projet

  • Métadonnées de session : ID de session uniques et informations de version

La statusline se met à jour automatiquement lorsque les messages de conversation changent (avec un taux limité à 300 ms maximum), et la sortie stdout de votre commande devient l'affichage d'état avec un support complet des couleurs ANSI.

Configuration de l'intégration

La configuration est simple. Ajoutez ceci dans vos paramètres Claude Code :

~/.claude/settings.json
{
"statusLine": {
"type": "command",
"command": "oh-my-posh claude",
"padding": 0
}
}

C'est tout ! Oh My Posh détectera automatiquement quand Claude Code fournit des données de session et affichera les informations pertinentes dans votre invite.

Il est important de noter que la commande CLI claude fonctionne différemment de votre configuration d'invite habituelle. Lorsqu'elle est utilisée comme commande statusline, Oh My Posh s'exécute dans un mode spécial complètement séparé de votre invite de terminal standard. Cela signifie que vous voudrez probablement créer une configuration dédiée, minimaliste, spécifiquement pour Claude Code, qui se concentre sur l'affichage des informations de session d'IA plutôt que sur vos éléments d'invite habituels.

Configuration personnalisée

Par défaut, la commande oh-my-posh claude fournit une statusline intégrée qui affiche votre répertoire de travail courant, le contexte git, le nom du modèle actif et l'utilisation de la fenêtre de contexte sous forme de jauge visuelle. Pour personnaliser cet affichage, utilisez le drapeau --config pour spécifier votre propre fichier de configuration de thème incluant un segment claude personnalisé adapté à vos préférences.

~/.claude/settings.json
{
"statusLine": {
"type": "command",
"command": "oh-my-posh claude --config ~/.claude.omp.json",
"padding": 0
}
}

Assurez-vous simplement que la configuration exploite également les données disponibles dans le segment claude pour visualiser les statistiques qui vous intéressent. Comme il ne s'agit pas d'une intégration d'invite classique, maintenez la statusline sur une seule ligne et utilisez des blocs d'invite alignés à gauche et à droite pour expérimenter.

~/.claude.omp.json
{
"$schema": "https://raw.githubusercontent.com/JanDeDobbeleer/oh-my-posh/main/themes/schema.json",
"palette": {
"black": "#262B44",
"blue": "#4B95E9",
"green": "#59C9A5",
"orange": "#F07623",
"red": "#D81E5B",
"sapling": "#a6d189",
"white": "#E0DEF4",
"yellow": "#F3AE35"
},
"accent_color": "32",
"blocks": [
{
"type": "prompt",
"alignment": "left",
"segments": [
{
"options": {
"dir_length": 3,
"folder_separator_icon": "\ue0bb",
"style": "fish"
},
"template": "{{ if .Segments.Git.Dir }} \uf1d2 <i><b>{{ .Segments.Git.RepoName }}{{ if .Segments.Git.IsWorkTree }} \ue21c{{ end }}</b></i>{{ $rel := .Segments.Git.RelativeDir }}{{ if $rel }} \ueaf7 {{ .Format $rel }}{{ end }}{{ else }} \uea83 {{ path .Path .Location }}{{ end }} ",
"foreground": "p:white",
"leading_diamond": "\ue0b6",
"background": "p:orange",
"type": "path",
"style": "diamond"
},
{
"options": {
"branch_icon": "\ue0a0",
"fetch_status": true
},
"template": " {{ if .UpstreamURL }}{{ url .UpstreamIcon .UpstreamURL }} {{ end }}{{ .HEAD }}{{if .BranchStatus }} {{ .BranchStatus }}{{ end }}{{ if .Working.Changed }} \uf044 {{ nospace .Working.String }}{{ end }}{{ if .Staging.Changed }} \uf046 {{ .Staging.String }}{{ end }} ",
"foreground": "p:black",
"leading_diamond": "<parentBackground,background>\ue0b0</>",
"trailing_diamond": "\ue0b4",
"background": "p:green",
"type": "git",
"style": "diamond",
"foreground_templates": [
"{{ if or (.Working.Changed) (.Staging.Changed) }}p:black{{ end }}",
"{{ if or (gt .Ahead 0) (gt .Behind 0) }}p:white{{ end }}"
],
"background_templates": [
"{{ if or (.Working.Changed) (.Staging.Changed) }}p:yellow{{ end }}",
"{{ if and (gt .Ahead 0) (gt .Behind 0) }}p:red{{ end }}",
"{{ if gt .Ahead 0 }}#49416D{{ end }}",
"{{ if gt .Behind 0 }}#7A306C{{ end }}"
]
}
]
},
{
"type": "prompt",
"alignment": "right",
"segments": [
{
"leading_diamond": "\ue0b6",
"template": " \udb82\udfc9 {{ .Model.DisplayName }} \uf2d0 {{ .TokenUsagePercent.GaugeUsed }} ",
"foreground": "p:white",
"background": "accent",
"type": "claude",
"style": "diamond"
},
{
"options": {
"charged_icon": "\ue22f ",
"charging_icon": "\ue234 ",
"discharging_icon": "\ue231 "
},
"cache": {
"duration": "10m",
"strategy": "session"
},
"leading_diamond": "<background,parentBackground>\ue0b2</>",
"trailing_diamond": "\ue0b4",
"template": "{{ if not .Error }} {{ .Icon }}{{ .Percentage }}%{{ end }}",
"foreground": "#111111",
"background": "accent",
"type": "battery",
"style": "diamond",
"background_templates": [
"{{if eq \"Discharging\" .State.String}}p:orange{{end}}",
"{{if eq \"Full\" .State.String}}p:green{{end}}"
]
}
]
}
],
"version": 4
}

Le segment Claude Code

Le nouveau segment claude d'Oh My Posh exploite ces données de statusline pour intégrer directement la conscience de session d'IA dans votre invite de terminal. Lorsque vous utilisez la commande oh-my-posh claude comme commande statusline dans Claude Code, vous accédez à une multitude d'informations de session qui peuvent être affichées dans votre invite sans nécessiter de connaissances techniques.

Exemple de configuration

Voici une configuration exemple affichant le nom du modèle et l'utilisation du contexte :

{
"type": "claude",
"style": "diamond",
"leading_diamond": "\ue0b6",
"trailing_diamond": "\ue0b4",
"foreground": "#FFFFFF",
"background": "#FF6B35",
"template": " \udb82\udfc9 {{ .Model.DisplayName }} \uf2d0 {{ .TokenUsagePercent.Gauge }} "
}

Cela affiche par exemple : 🤖 Claude 4.5 Sonnet ▰▰▰▱▱

La jauge fournit un retour visuel instantané sur votre consommation de la fenêtre de contexte, crucial pour gérer les longues sessions de codage.

Les détails techniques

Sous le capot, Oh My Posh lit les données de session JSON détaillées que Claude Code fournit via stdin lorsqu'il est utilisé comme commande statusline. Le segment ne s'active que lorsque les données de session Claude Code sont disponibles, donc il n'y a aucun impact sur les performances lorsque vous n'utilisez pas Claude Code.

Premiers pas

Si vous utilisez déjà Oh My Posh, intégrer Claude Code est aussi simple que :

  1. Installez Claude Code si ce n'est déjà fait

  2. Ajoutez la configuration statusline à vos paramètres Claude Code

  3. Créez éventuellement votre propre configuration incluant le segment claude

  4. Lancez une session Claude Code et observez votre prompt s'animer

Pour les options de configuration détaillées et toutes les propriétés disponibles, consultez la documentation complète du segment Claude.

Perspectives futures

Cette intégration ouvre des possibilités passionnantes. Imaginez des prompts qui :

  • Changent de couleur selon le pourcentage d'utilisation des tokens

  • Affichent différentes icônes pour différents modèles d'IA

  • Signalent les coûts élevés lors de sessions onéreuses

  • Intègrent d'autres segments pour afficher un contexte de développement supplémentaire

Les bases sont posées, et c'est maintenant à la communauté de créer des configurations étonnantes qui rendront le développement assisté par l'IA encore plus fluide.