Comment réduire des sections de code dans Visual Studio Code pour Windows?

Comment puis-je plier ou réduire des sections de code dans Visual Studio Code?

Cette fonctionnalité est-elle prise en charge?

Le pliage a été déployé et est désormais implémenté depuis Visual Studio Code version 0.10.11 . Ces raccourcis clavier sont disponibles:

• Plier replie la région la plus intérieure non effondrée du curseur:

  • Ctrl+ Shift+ [sur Windows et Linux
  • ⌥+ ⌘+ [sur macOS

• Déplier déplie la région réduite au niveau du curseur:

  • Ctrl+ Shift+ ]sur Windows et Linux
  • ⌥+ ⌘+ ]sur macOS

• Tout replier replie toutes les régions dans l'éditeur:

  • Ctrl+ ( K=> 0) (zéro) sous Windows et Linux
  • ⌘+ ( K=> 0) (zéro) sur macOS

• Déplier tout déplie toutes les régions dans l'éditeur:

  • Ctrl+ ( K=> J) sur Windows et Linux
  • ⌘+ ( K=> J) sur macOS

Références: https://code.visualstudio.com/docs/getstarted/keybindings

À partir de Visual Studio Code version 1.12.0, avril 2017, consultez Édition de base> Pliage section dans la documentation.

Les clés par défaut sont:

Tout plier: CTRL+ K, CTRL+0 (zéro)

Niveau de pliage [n]: CTRL+ K, CTRL+[n] *

Déplier tout: CTRL+ K, CTRL+J

Région de pliage: CTRL+ K, CTRL+[

Déplier la région: CTRL+ K, CTRL+]

* Niveau de pliage: pour plier toutes les classes sauf les plus extérieures, essayez CTRL+ K, CTRL+1

Mac: utilisez ⌘plutôt CTRL(merci Prajeet)

Le pliage de code par régions est arrivé avec la v1.17. Documentation pliante par régions . Et v1.19 et 1.23 .

[En général, vous pouvez ajouter un espace, par exemple // region and // endregionà //region and //endregionet cela fonctionnera également.]

TypeScript/JavaScript: //#region and //#endregion or // #region and // #endregion
C#:                    #region and #endregion
C/C++:                 #pragma region and #pragma endregion
F#:                    //#region and //#endregion
PowerShell:            #region and #endregion
Python:                #region and #endregion
VB:                    #Region and #End Region
PHP:                   #region and #endregion
Bat:                   ::#region and ::#endregion or REM #region and REM #endregion
Markdown:              <!-- #region --> and <!-- #endregion -->
Golang                 //region and //endregion or //#region and //#endregion
Java                   //#region and //#endregion
CSS/SCSS/Less:         /* #region */ and /* #endregion */ or /*#region*/ and /*#endregion*/
SCSS/Less:             // #region and // #endregion
Go:                    // region, // endregion and // #region, // #endregion
shellscript:           # region and # endregion
Perl5                  #region and #endregion or =pod and =cut`

Important: Si vous ne voyez pas votre langue dans la liste:

Chaque langue a également des extraits disponibles pour les marqueurs. Tapez '#' et invoquez l'achèvement du code pour les voir. Pour que les marqueurs de région soient configurés pour votre langue, contactez le fournisseur d'extension de langue.

Tapez donc #puis Ctrl+ Spacepour voir les marqueurs de région pour n'importe quelle langue.

Cette fonctionnalité est désormais disponible dans la version standard. Pour faire apparaître les contrôles de réduction / expansion, vous devez passer la souris sur la zone juste à droite des numéros de ligne, comme indiqué dans cette capture d'écran:

Vous devez ajouter des paramètres utilisateur:

{
    "editor.showFoldingControls": "always",
    "editor.folding": true,
    "editor.foldingStrategy": "indentation", 
}

Les raccourcis par défaut pour réduire / étendre sont:

Ctrl+ Shift+ [: "Plier"

Ctrl+ Shift+ Alt+ [: "Tout plier"

Ctrl+ Shift+ ]: "Déplier"

Ctrl+ Shift+ Alt+] : "Déplier tout"

Ou allez sur keybindings.json et changez comme vous le souhaitez.

Par exemple:

{
    "key": "cmd+k cmd+m",
    "command": "editor.foldAll",
    "when": "editorFocus"
},
{
    "key": "cmd+m cmd+k",
    "command": "editor.unfoldAll",
    "when": "editorFocus"
},

Si aucun des raccourcis ne fonctionne (comme pour moi), vous pouvez également ouvrir la palette de commandes ( Ctrl+ 3ou Affichage -> Palette de commandes ...) et saisir fold all:

ctrl+ k+ 0: Pliez tous les niveaux (espace de noms, classe, méthode, bloc)

ctrl+ k+ 1: namspace

ctrl+ k+ 2: classe

ctrl+ k+ 3: méthodes

ctrl+ k+ 4: blocs

ctrl+ k+ [ou ]: bloc de curseur actuel

ctrl+ k+ j: Déplier

La réduction est désormais prise en charge dans la version 1.0 :

Raccourcis repliables du code source

Il existe de nouvelles actions de pliage pour réduire les régions de code source en fonction de leur niveau de pliage.

Il existe des actions pour replier le niveau 1 ( Ctrl+ K Ctrl+ 1) au niveau 5 ( Ctrl+ K Ctrl+ 5). Pour déplier, utilisez Déplier tout ( Ctrl+ Shift+ Alt+ ]).

Les actions de pliage de niveau ne s'appliquent pas à la région contenant le curseur actuel.

J'ai eu un problème pour trouver le ]bouton de mon clavier (disposition norvégienne), et dans mon cas, c'était le Åbouton. (Ou deux boutons à gauche et un vers le bas à partir du bouton de retour arrière.)

Avec JavaScript:

//#region REGION_NAME
   ...code here
//#endregion

Depuis la version 1.3.1 (17/07/2016), la réduction de bloc est beaucoup plus pratique.

Toute ligne suivie d'une ligne en retrait aura un caractère «-» pour permettre la réduction. Si le bloc est réduit, il sera alors remplacé par un caractère «+» qui ouvrira le bloc réduit.

Le ( Ctrl+ Shift+ Alt+ ]) affectera toujours tous les blocs, fermant un niveau. Chaque utilisation répétée fermait un niveau de plus. Le ( Ctrl+ Shift+ Alt+[ ) fonctionne dans le sens inverse.

Hourra, l'effondrement des blocs fonctionne enfin utilement.

Pas de conseils techniques ici, juste de simples ajustements des préférences de VsCode.

J'ai réussi à afficher les contrôles de pliage de code toujours dans VsCode en allant dans les préférences et en recherchant «pliage». Maintenant, sélectionnez simplement pour toujours afficher ces commandes. Cela fonctionne avec le code Typescript et le HTML des modèles dans la solution Angular 8 avec laquelle je l'ai testé.

Cela a été testé avec VsCode Insiders 1.37.0 fonctionnant sur un système d'exploitation Windows 10.

La v1.42 ajoute de belles améliorations à l'apparence et au fonctionnement des plis. Voir https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_42.md#folded-range-highlighting :

Mise en évidence de la plage pliée

Les gammes pliées sont désormais plus faciles à découvrir grâce à une couleur de fond pour toutes les gammes pliées.

Couleur de surbrillance de pli Thème: Dark +

La fonction est contrôlée par le paramètre editor.foldingHighlight et la couleur peut être personnalisée avec l'éditeur de couleur.foldBackground.

"workbench.colorCustomizations": { "editor.foldBackground": "#355000" }

Améliorations pliantes

Shift + Clicksur l'indicateur de pliage ne plie que les plages intérieures. Shift + Clickà nouveau (lorsque toutes les plages internes sont déjà pliées), le parent sera également plié. Shift + Clickdéplie à nouveau tout.

Lorsque vous utilisez la commande Plier (kb ( editor.fold))] sur une plage déjà pliée, la plage parent dépliée suivante sera pliée.

Sur un Mac, c'est la touche de commande RHS ⌘K, pas la gauche pour les commandes de pliage de code.

Sinon , la main gauche touche Commande supprimera la ligne en cours, ⌘K.

Cette fonctionnalité est désormais prise en charge, depuis Visual Studio Code 1.17 . Pour plier / réduire votre bloc de code, ajoutez simplement les balises de région, telles que //#region my block nameet //#endregionsi vous codez en TypeScript / JavaScript.

Exemple:

Extension VSCode: Fold Level , un pli clé au niveau souhaité.

Je souhaite que Visual Studio Code puisse gérer:

#region Function Write-Log
Function Write-Log {
    ...
}
#endregion Function Write-Log

À l'heure actuelle, Visual Studio Code l'ignore et ne le réduit pas. Pendant ce temps, Notepad ++ et PowerGUI gèrent cela très bien.

Mise à jour: je viens de remarquer une mise à jour pour Visual Studio Code. Ceci est désormais pris en charge!

Remarque: ces raccourcis fonctionnent uniquement comme prévu si vous modifiez votre keybindings.json

Je n'étais pas satisfait des raccourcis par défaut, je voulais qu'ils fonctionnent comme suit:

• Pli: Ctrl+ Alt+]
• Pliez récursivement: Ctrl+ ⇧ Shift+ Alt+]
• Tout plier: Ctrl+ kpuis Ctrl+]
• Déplier: Ctrl+ Alt+[
• Déplier récursivement: Ctrl+ ⇧ Shift+ Alt+[
• Déplier tout: Ctrl+ kpuis Ctrl+[

Pour le configurer:

• Ouvert Preferences: Open Keyboard Shortcuts (JSON)( Ctrl+ ⇧ Shift+ p)
• Ajoutez l'extrait suivant à ce fichier

  Vous avez déjà des raccourcis clavier personnalisés pour le pliage / dépliage? Ensuite, vous devrez les remplacer.

    {
        "key": "ctrl+alt+]",
        "command": "editor.fold",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+alt+[",
        "command": "editor.unfold",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+shift+alt+]",
        "command": "editor.foldRecursively",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+shift+alt+[",
        "command": "editor.unfoldRecursively",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+k ctrl+[",
        "command": "editor.unfoldAll",
        "when": "editorTextFocus && foldingEnabled"
    },
    {
        "key": "ctrl+k ctrl+]",
        "command": "editor.foldAll",
        "when": "editorTextFocus && foldingEnabled"
    },