Comment ajouter des extraits de code personnalisés dans VSCode?

Est-il possible d'ajouter des extraits de code personnalisés dans Visual Studio Code? Et si oui, comment? VSCode est basé sur Atom, donc cela devrait être possible.

1. Appuyez sur> shift+ command+ pet saisissez des extraits
2. Sélectionnez Préférences: Ouvrez les extraits d'utilisateur
3. Choisissez le type de langue pour lequel vous souhaitez ajouter l'extrait de code personnalisé
4. vscode a des commentaires pour expliquer comment ajouter un extrait de code , comme décrit sur:> vsdoc

Disons que nous voulons ouvrir des extraits personnalisés pour la langue GO. Ensuite, nous pouvons faire:

1. Frapper> command+p
2. Tapez: go.json + enterEt vous arrivez sur la page d'extrait de code personnalisé

Les extraits de code sont définis au format JSON et stockés dans un fichier .json par utilisateur (languageId). Par exemple, les extraits de code Markdown sont placés dans un fichier markdown.json.

Mettre à jour les nouveaux outils:
site du générateur d'extraits de code: https://snippet-generator.app/

option - 1 Il existe un plugin VsCode appelé: snippet creator .

Après l'avoir installé, il ne vous reste plus qu'à:

1. Sélectionnez le code dont vous souhaitez en faire un extrait.
2. Faites un clic droit dessus et sélectionnez "Palette de commandes" (ou Ctrl+ Shift+ P).
3. Écrivez «Créer un extrait».
4. Choisissez le type de fichiers à regarder pour déclencher votre raccourci d'extrait de code.
5. Choisissez un raccourci d'extrait de code.
6. Choisissez un nom d'extrait.

option - 2 consultez ce site Web . vous pouvez générer des extraits pour vs code, sublime text et atom.

Une fois l'extrait de code généré sur ce site. Accédez au fichier d'extrait de code IDE respectif et collez-le. Par exemple, pour un extrait de code JS dans le code VS, allez dans Fichier-> préférence-> extrait d'utilisateur, puis il ouvre le fichier javascript.json, puis collez l'extrait de code du site ci-dessus à l'intérieur et nous sommes prêts à partir.

À partir de la version 0.10.6, vous pouvez ajouter des extraits de code personnalisés. Lisez la documentation sur la création de vos propres extraits . Vous pouvez trouver / créer des extraits de code personnalisés en plaçant le fichier json dans C:\Users\<yourUserName>\AppData\Roaming\Code\User\snippets. Par exemple, un extrait de code javascript personnalisé serait dans un\snippets\javascript.json

Vous pouvez également publier vos extraits, ce qui est également une fonctionnalité très intéressante. John Papa a créé un joli extrait angulaire + dactylographié que vous pouvez télécharger en tant qu'extension sur le marché .

Voici un exemple d'extrait de code pris pour la documentation sur une boucle javascript for:

"For Loop": {
    "prefix": "for",
    "body": [
        "for (var ${index} = 0; ${index} < ${array}.length; ${index}++) {",
        "\tvar ${element} = ${array}[${index}];",
        "\t$0",
        "}"
    ],
    "description": "For Loop"
},

Où

• For Loop est le nom de l'extrait
• prefixdéfinit un préfixe utilisé dans la liste déroulante IntelliSense. Dans ce cas pour.
• bodyest le contenu de l'extrait. Les variables possibles sont:
  • 1 $, 2 $ pour les tabulations
  • $ {id} et $ {id: label} et $ {1: label} pour les variables
  • Les variables avec le même identifiant sont connectées.
• description est la description utilisée dans la liste déroulante IntelliSense

Vous pouvez consulter cette vidéo pour un court tutoriel rapide

https://youtu.be/g1ouTcFxQSU

Allez dans Fichier -> Préférences -> Extraits d'utilisateur . Sélectionnez votre langue préférée.
Tapez maintenant le code suivant pour créer un extrait de boucle for:

  "Create for loop":{
    "prefix": "for",
    "body":[
      "for(int i = 0; i < 10; i++)",
      "{",
      "   //code goes here",
      "}"
    ],
   "description": "Creates a for loop"
  }

Vous avez terminé.
Tapez "pour" dans l'éditeur et utilisez la première prédiction.

RACCOURCI--

1. installez l' extension Snippet-creator .
   
2. Mettez en surbrillance le code dont vous avez besoin pour créer l'extrait.
   
3. appuyez sur ctrl+shift + Pet tapez "Créer un extrait" sur la palette de commandes et appuyez sur ENTRÉE.
   
4. sélectionnez la langue pour laquelle vous souhaitez créer un extrait (par exemple: -CPP), puis saisissez le
   nom de l'extrait, saisissez le raccourci de l'extrait, puis saisissez la description de l'extrait.
   Vous êtes maintenant prêt à partir.
   Tapez le raccourci de l'extrait de code dans l'éditeur que vous avez entré à l'étape 4, puis sélectionnez le
   prédiction (si aucune prédiction ne vient, appuyez sur ctrl + espace) qui vient en premier.
   

J'espère que cela t'aides :)

Remarque: allez dans File-> Preferences-> User Snippets. Sélectionnez ensuite la langue dans laquelle vous avez
créé l'extrait. Vous y trouverez l'extrait.

Il existe un plug-in VsCode appelé: snippet creator .

Après l'avoir installé, il ne vous reste plus qu'à:

1. Sélectionnez le code dont vous souhaitez en faire un extrait.
2. Faites un clic droit dessus et sélectionnez "Palette de commandes" (ou Ctrl+ Shift+P).
3. Écrivez «Créer un extrait».
4. Choisissez le type de fichiers à regarder pour déclencher votre raccourci d'extrait de code.
5. Choisissez un raccourci d'extrait de code.
6. Choisissez un nom d'extrait.

C'est tout ..

Remarque: si vous souhaitez modifier vos extraits, vous les trouverez dans [fileType] .json
Exemple: Ctrl+ P, puis sélectionnez "javascript.json"

Vous pouvez ajouter des scripts personnalisés, allez à File --> Preferences --> User Snippets. Sélectionnez votre langue préférée.

Si vous choisissez Javascript, vous pouvez voir le script personnalisé par défaut pour console.log(' ');comme ceci:

"Print to console": {
    "prefix": "log",
    "body": [
        "console.log('$1');",
        "$2"
    ],
    "description": "Log output to console"
},

J'ai essayé d'ajouter des extraits dans javascriptreact.json mais cela n'a pas fonctionné pour moi.

J'ai essayé d'ajouter des extraits dans la portée mondiale, et cela fonctionne comme un charme.

FILE --> Preferences --> User snippets

ici sélectionnez New Global Snippets File, donnez le nom javas criptreact.code-snippets.

Pour les autres langues, vous pouvez nommer [your_longuage] .code-snippets

Il s'agit d'une fonctionnalité non documentée pour le moment mais arrive bientôt. Il existe un dossier dans lequel vous pouvez les ajouter et ils apparaîtront, mais il peut changer (il n'est pas documenté pour une raison).

Le meilleur conseil est de l'ajouter au site uservoice et d'attendre sa fin. Mais ça arrive.

VSCode introduit cela dans la version 0.5, voir ici . La syntaxe de l'extrait de code suit la syntaxe de l' extrait de code TextMate et peut écrire dans les préférences utilisateur.

Si vous préférez ne pas écrire vos extraits en JSON, consultez Snipster . Il vous permet d'écrire des extraits comme vous écririez le code lui-même - sans avoir à mettre chaque ligne entre guillemets, à échapper des caractères, à ajouter des méta-informations, etc.

Il vous permet également d' écrire une fois, de publier n'importe où . Vous pouvez donc utiliser votre extrait de code dans VS Code, Atom et Sublime, ainsi que d'autres éditeurs à l'avenir. Plus d'infos ici .

Ce n'est peut-être pas une vraie réponse (comme certains l'ont répondu ci-dessus), mais si vous souhaitez créer des extraits de code personnalisés pour d'autres personnes, vous pouvez créer des extensions à l'aide de yeoman et npm (qui par défaut vient avec NodeJS). REMARQUE: il s'agit uniquement de créer des extraits de code pour les autres systèmes. Mais cela fonctionne aussi pour vous! Sauf que vous avez besoin de code JS pour tout.