Code snippets dans VSCode
Les snippets sur VSCode permettent de gagner un temps précieux, et surtout, dans mon cas, d’éviter des fautes de frappe.
Le tuto complet se trouve dans la vidéo ci-jointe. Une fois que j’ai compris le principe, je passe par ChatGPT pour créer les snippets dont j’ai besoin. Voici un exemple de Prompt. Les placeholders sont des éléments sur lequel le focus sera placé à chaque pression du TAB, 1:placeholder à la première pression, 2:placeholder à la 2e etc.
Create a vscode snippet to generate jquery on click function. click the .element targets the .target and shows it with .show() .element and .target are placeholders.
Création du snippet dans le fichier JSON de VSCode
// ce snippet affiche le JS ci-dessus.
// les placeholders
// 1:element
// 2:target
// 3:functionName
// seront éditables à chaque pression de TAB
{
"jQuery on click show event": {
"prefix": "click",
"body": [
"$('.${1:element}').click(function() {",
" $('.${2:target}').show();",
"});"
],
"description": "Create jQuery on click show event"
},
"jQuery on ready show event": {
"prefix": "ready",
"body": [
"$(document).ready(function() {",
"\t ${3:functionName} ",
"});"
],
"description": "Create jQuery on ready show event"
}
}
Génération de la fonction suivante après avoir écrit click. au premier TAB le focus est mis sur .element, au deuxième TAB il est mis sur .target
$(document).ready(function() {
$('.element').click(function() {
$('.target').show();
});
});