Automatiser des tâches à l'aide de scripts NodeJS

Automatiser des tâches à l'aide de scripts NodeJS

Tout développeur qui se respecte est un flemmard dans l'âme. Et qu'est-ce qu'un flemmard aime par dessus tout ?

Automatiser des tâches, pardi !

C'est pourquoi aujourd'hui nous allons voir comment mettre en place des scripts JavaScript permettant la création/modification de fichiers, et comment les appeler à l'aide de commandes paramétrables.

Cet article n'a pas pour vocation à vous apprendre à installer NodeJS, Npm ou Webpack, et part du principe que vous connaissez suffisamment les bases pour comprendre de quoi on parle. Il existe pléthore d'articles et tutoriels sur le net traitant déjà du sujet, et certainement mieux que nous ;p

NPM Scripts

Si vous avez déjà réalisé un projet avec NodeJS et NPM (et dans le cas qui nous concerne, Webpack), vous avez certainement déjà trifouiller dans un fichier package.json, et notamment l'objet scripts.
Celui-ci permet grossièrement de définir des alias permettant l'exécution de commandes parfois longues et fastidieuses, de celles qu'on préférerait ne pas avoir à taper toutes les 5 minutes :

Ce petit bout de code permet, en tapant dans votre console npm run build, de lancer la commande webpack --progress --colors. Sur le même principe, taper npm run watch lancera la même commande, mais cette fois avec le paramètre --watch. Pratique, non ?
Il est possible d'enchainer plusieurs commandes à la suite dans un seul script, grâce à l'opérateur && :

Dans cet exemple, utiliser la commande "npm run build" supprimera le dossier "build" de votre projet, avant de lancer la compilation webpack

Ce genre de petit script est idéal pour exécuter des actions simples, et même s'il est possible d'enchainer plusieurs commandes à la suite, on en atteint vite les limites dès que l'on veut faire quelque chose de plus complexe. De plus, certaines commandes peuvent poser problème au niveau de la compatibilité cross-platfom. Certaines commandes ne sont pas les mêmes, que vous soyez sur Linux, Windows ou macOS.
Que faire dans ce cas là ? Ce que fait tout bon développeur frontend quand des complications se présentent: du Javascript !

Node Scripts

Un script NodeJS, c'est un bête fichier .js qui exécute... du javascript. Celui-ci peut être directement appelé depuis votre console, à l'aide de la commande node ou bien depuis un script NPM, comme nous l'avons vu précédemment :

Commençons par un exemple simple et super original : je veux que mon script affiche "Hello !" dans ma console.
Pour se faire, créons un fichier hello.js dans notre projet. Celui-ci ne contiendra qu'une seule ligne pour le moment :

C'est tout bête, hein ? Pour lancer le programme, il nous suffit de taper node hello.js

Formidable ! Pour rendre les choses un peu plus intéressante, nous allons faire afficher à notre programme "Hello" suivi de notre nom, passé en paramètre à notre commande.

Pour récupérer le paramètre "Web ex Machina", il nous faut décortiquer la variable process.argv, accessible dans notre fichier hello.js. process.argv est un tableau contenant des informations sur la commande passée en console.
Les deux premiers items de ce tableau ne nous intéressent pas. process.argv[0] et process.argv[1] contiennent respectivement les chemins vers l’exécutable Node et notre hello.js.
La liste des paramètres commence donc à partir de process.argv[2], ce qui nous permet de modifier notre script de cette façon :

Dès lors, si nous relançons notre script, voilà ce qui apparaît :

Voilà qui nous ouvre pas mal de perspectives, n'est-ce pas ?

Cas concret: création automatique de dossiers et fichiers

Maintenant qu'on a vu les bases - je sais, on ne devait pas parler des bases - on va pouvoir s'attaquer à quelque chose de plus tangible : utiliser une commande avec un nom en paramètre, afin de créer un dossier contenant un ensemble de fichiers (js, scss et html), avec quelques lignes de codes préformatées. Je souhaite également pouvoir supprimer facilement tout le dossier si besoin.

Typiquement, cette procédure sert de base à la création rapide de composants pour nos sites web. Elle permet non seulement de nous faire gagner du temps, mais surtout de limiter grandement les erreurs et oublis qui peuvent survenir lorsqu'on fait tout ça à la main ;)

Notre commande finale ressemblera à ceci: npm run component [name] [cmd]

Pour commencer, créons un fichier component.js, situé dans un dossier scripts (parce qu'on est pas des bêtes et qu'on aime bien les choses bien rangées).
Pour manipuler des fichiers, nous allons avoir besoin du module File System de Node.
Nous récupérons ensuite nos paramètres et les stockons dans des variables. Notez que les variables name et cmd obtiennent ici des valeurs par défaut si les paramètres ne sont pas renseignés lors de notre appel au script.

Si le paramètre name vaut "false", nous affichons un log de l'erreur et mettons fin au script avec un "return false;"

Ensuite, nous traitons le paramètre "cmd", dans un bon vieux switch. Si la valeur de "cmd" nous est connue, la fonction correspondante sera jouée. Si vous avez fait attention un peu plus tôt, vous aurez remarqué que si le paramètre "cmd" n'a pas été renseigné, il vaut par défaut "create". En revanche, si une commande incorrecte a été saisie, un message d'erreur et affiché et le script s'arrête là.

Voyons maintenant en détail la fonction createComponent:

Et enfin la fonction deleteComponent, qui parle d'elle-même

Afin de pas avoir à écrire une commande trop longue, du genre node scripts/component.js helloWorld create, nous déclarons un alias component dans package.json qui permettra de faire appel à notre script :

Et voilà ! Maintenant, en utilisant la commande npm run component helloWorld, nous pouvons constater qu'un dossier "helloWorld" est effectivement apparu dans notre arborescence, avec ses trois fichiers et leurs contenus générés dynamiquement :

De la même façon, npm run component helloWorld delete supprimera intégralement le dossier helloWorld de notre projet.

En conclusion

Cette démonstration, simpliste et largement optimisable, nous a permit de voir qu'il était possible d'automatiser de nombreuses tâches fastidieuses et peu intéressantes dans un projet. Et nous n'avons fait qu'effleurer le sujet, avec le module File System !
Pour aller un peu plus loin, sachez qu'il existe également ShellJS, un package NPM permettant l’exécution de commande console via Node, et notamment des commandes Git ;p

Dans la même catégorie