Comment styliser les messages du terminal avec Node

Il est courant d’utiliser la Console comme outil dans nos applications Node, que ce soit pour valider une donnée, afficher un message ou une erreur importante, ou encore aider au débogage des données. Cependant, telle qu’elle est utilisée nativement, elle manque cruellement d’attrait visuel, car tous les messages se présentent de la même façon.

Avec Chalk — bibliothèque open source disponible sur GitHub avec plus de 13k étoiles et actuellement en version 3.0.0 — nous pouvons appliquer divers styles aux messages du terminal.

Pour l’essayer, il faut initialiser un projet avec npm. Pour garantir que le résultat soit exactement identique à celui que je vais montrer ici, assurez-vous d’installer la version 3.0.0 en tant que dépendance.

npm i [email protected]

Nous allons créer un fichier app.js et écrire notre premier message stylisé en utilisant la méthode green().

const chalk = require('chalk');
const msg = chalk.green('Hello world!');
console.log(msg);

Le rendu est vraiment sympa :

Sympa, non ? Explorons quelques autres fonctionnalités de Chalk.

Stylage en chaîne

Comme la page officielle de la bibliothèque le dit, Chalk dispose d’une API flexible qui nous permet d’enchaîner et d’imbriquer les styles. Cela signifie que nous pouvons, par exemple, appliquer le gras et la couleur à un message en une seule fois :

const msg2 = chalk.bold.red("Hello World!"); 
console.log(msg2);// ou chalk.red.bold , a ordem não importa!

L’ordre des appels n’importe pas, le résultat reste le même :

De plus, nous pouvons aussi imbriquer les styles. Par exemple :

const msg3 = chalk.bold(chalk.red("Hello ") + chalk.green("World"));
console.log(msg3);

Les chaînes “Hello” et “World” ont des caractéristiques distinctes, mais elles hériteront toutes les deux du gras. Regardez :

Pour terminer, jetons un coup d’œil à la facilité avec laquelle on peut créer ses propres règles de style en utilisant l’API Chalk.

Stylage selon votre style personnel

Nous pouvons créer nos propres règles en utilisant l’API Chalk de manière très pratique. Je vais d’abord présenter un exemple puis explorer ce que fait chaque ligne.

const error = chalk.bold.red;
const warning = chalk.bold.keyword('orange');console.log(error("Algo errado não está certo!"));
console.log(warning("Não está errado mas também não está certo!"));

Ici nous créons deux styles, error et warning. Le premier met le message en gras et en rouge. Le second met le message en gras et en orange.

Au moment d’afficher les messages, il suffit d’employer les mots-clés créés pour les styles ! Regardez le résultat :

Divertissant et pratique, non ?

Code source

Pour ceux qui souhaitent tester sans avoir à recopier l’article, voici le code source :

const chalk = require("chalk");

const msg = chalk.green("Hello World!");
const msg2 = chalk.red.bold("Hello World!");
const msg3 = chalk.bold(chalk.red("Hello ") + chalk.green("World"));
console.log(msg);
console.log(msg2);
console.log(msg3);

const error = chalk.bold.red;
const warning = chalk.bold.keyword('orange');
console.log(error("Algo errado não está certo!"));
console.log(warning("Não está errado mas também não está certo!"));

Conclusion

chalk n’est pas une bibliothèque révolutionnaire et peut sembler inutile pour beaucoup, cependant, si vous êtes un utilisateur passionné par la Console et que vous l’utilisez fréquemment, il n’y a aucun doute : cela mérite qu’on y jette un coup d’œil.

Références

• https://www.npmjs.com/package/chalk
• https://github.com/chalk/chalk