Inline Console Log

Inline Console Log est une extension VS Code qui execute le fichier JavaScript ou TypeScript ouvert et affiche les resultats des console.log, console.warn et console.error directement a droite des lignes concernees.

const hero = "Gaby";
console.log(`My hero is ${hero}`); // -> "My hero is Gaby"

Features

• Affichage inline des logs dans l'editeur.
• Support de console.log, console.warn et console.error.
• Icône Inline Log dans l'Activity Bar avec des actions rapides.
• Raccourci clavier dedie pour lancer l'analyse.
• Nettoyage manuel des annotations inline.
• Arret du log inline depuis le panneau lateral ou la palette de commandes.
• Mode auto-run optionnel a l'ouverture et a la sauvegarde des fichiers.
• Statut d'execution dans la barre de statut VS Code.
• Themes d'affichage subtle, bright et minimal.

Usage

Ouvrez un fichier JavaScript ou TypeScript, puis lancez la commande:

• Ctrl+Alt+,: execute le fichier actif et affiche les logs inline.
• Ctrl+Shift+C: efface les annotations inline.

Depuis l'icone Inline Log dans la barre laterale, vous pouvez aussi cliquer sur:

• Lancer le log inline
• Effacer les logs
• Arrêter le log inline

Les memes actions sont disponibles dans la palette de commandes:

• Inline Log: Exécuter et afficher les logs inline
• Inline Log: Effacer les logs inline
• Inline Log: Arrêter les logs inline
• Inline Log: Auto-run: activer/désactiver

Extension Settings

Cette extension ajoute les options suivantes:

{
  "inlineConsoleLog.autoRun": true,
  "inlineConsoleLog.timeout": 5000,
  "inlineConsoleLog.theme": "subtle"
}

• inlineConsoleLog.autoRun: execute automatiquement l'extension a l'ouverture et lors de la sauvegarde d'un fichier supporte.
• inlineConsoleLog.timeout: limite d'execution en millisecondes.
• inlineConsoleLog.theme: style visuel des annotations inline. Valeurs possibles: subtle, bright, minimal.

Requirements

• VS Code 1.74.0 ou plus recent.
• Node.js disponible dans le PATH, car le fichier actif est execute avec node.

How It Works

L'extension cree une version temporaire du fichier actif. Dans cette version, les appels console.log, console.warn et console.error sont remplaces par un shim qui capture la sortie et conserve le numero de ligne d'origine.

Le fichier temporaire est ensuite execute avec Node.js. Les sorties capturees sont associees aux lignes du fichier original, puis affichees avec des decorations VS Code inline.

Known Issues

• Les appels console.* multi-lignes ne sont pas pris en charge.
• Le code est reellement execute. Evitez de lancer l'extension sur un fichier qui effectue des actions sensibles comme des suppressions, des ecritures disque non voulues ou des requetes reseau.
• Les fichiers TypeScript sont executes directement par Node.js. Le code TypeScript qui necessite une compilation prealable peut echouer.

Development

cd extension
npm install
npm run compile

Pour tester l'extension en local, ouvrez le dossier extension dans VS Code et lancez une session Extension Development Host avec F5.

Pour generer un paquet .vsix:

npm install -g @vscode/vsce
vsce package

Release Notes

0.0.4

• Ajout d'une icone Inline Log dans l'Activity Bar.
• Ajout d'un panneau lateral avec les actions lancer, effacer et arreter.
• Ajout de la commande Inline Log: Arrêter les logs inline.

0.0.3

• Ajout du raccourci Ctrl+Alt+, pour executer le fichier actif et afficher les logs inline.
• Documentation mise au format standard d'une extension VS Code.

0.0.2

• Ajout des commandes, de l'auto-run, des themes et de la barre de statut.

0.0.1

• Premiere version de l'affichage inline des console.log.