Qui n’a pas tappé un millier de fois echo
ou console.log
? Voir function(){}
, ou encore () => {}
?
Grâce aux snippets customisés, vous allez pouvoir vous affranchir de cette corvée et être plus productif.
Trouver le menu des custom snippet dans VSCode
Faites la combinaison de touches CTRL + SHIFT + P (sous Windows) et tapez « snippet », sélectionnez custom
Ceci va vous amener au fichier csl.code-snippets . Voici un example de code que vous pouvez faire :
"Print to console": { "scope": "javascript,typescript", "prefix": "cls", "body": [ "console.log('$1','$2');", ], "description": "Log output to console" }
Vous tapez le prefix « cls » et le body s’affichera. Notez les placeholder $1
et $2
, vous pourrez basculer de l’un à l’autre avec la touche TAB
.
Un site pour générer le code pour vos snippets.
Les snippets par framework ou langage
Il existe déjà dans la marketplace, des plugins où les snippets sont déjà définis. Allez dans la marketplace et tapez « snippet ». Emmet est intégré d’office et s’occupe du HTML et CSS. Pour le reste je vous laisse découvrir, il y en a pour tous les langages et frameworks. Normalement en 2024 VSCode est capable de détecter le langage de votre projet et vous propose des plugins à installer. Par exemple, si vous avez un fichier docker compose, il va vous proposer le plugin docker correspondant.