Comment masquer certains fichiers de la barre latérale dans Visual Studio Code?


631

À l'aide du code Visual Studio de Microsoft, comment masquer certains fichiers et modèles de fichiers d'apparaître dans la barre latérale?

Je souhaite masquer .metaet .gitstyliser les fichiers


3
Ce n'est pas exactement ce dont vous avez besoin, mais vous pouvez au moins exclure certains dossiers des recherches en ajoutant une propriété "search.excludeFolders" à vos paramètres d'espace de travail. Cela me suffisait car j'atteins généralement les fichiers par le Ctrl-Emenu.
Katana314

1
Bon conseil. J'arrive aussi aux fichiers de cette façon et command+p(venant d'un fond sublime)
Chris

1
Problème lié à la dissimulation automatique des fichiers .gitignored dans la barre latérale: github.com/Microsoft/vscode/issues/38878
Johan Walles

Réponses:


1085

Vous pouvez configurer des modèles pour masquer les fichiers et dossiers de l'explorateur et des recherches.

  1. Ouvrez VS User Settings (Menu principal:) File > Preferences > Settings. Cela ouvrira l'écran de réglage.
  2. Recherchez files:excludedans la recherche en haut.
  3. Configurez le paramètre utilisateur avec de nouveaux modèles glob selon vos besoins. Dans ce cas, ajoutez ce modèle node_modules/puis cliquez sur OK. La syntaxe du modèle est puissante. Vous pouvez trouver les détails de correspondance des modèles dans la rubrique Rechercher dans les fichiers .

Lorsque vous avez terminé, cela devrait ressembler à ceci: entrez la description de l'image ici

Si vous souhaitez modifier directement le fichier de paramètres: Par exemple pour masquer un dossier node_modules de niveau supérieur dans votre espace de travail:

"files.exclude": {
    "node_modules/": true
}

Pour masquer tous les fichiers commençant par ._tels que les ._.DS_Storefichiers trouvés sur OSX:

"files.exclude": {
    "**/._*": true
}

Vous avez également la possibilité de modifier les paramètres de l'espace de travail (menu principal:) File > Preferences > Workspace Settings. Les paramètres de l'espace de travail créeront un .vscode/settings.jsonfichier dans votre espace de travail actuel et ne seront appliqués qu'à cet espace de travail. Les paramètres utilisateur seront appliqués globalement à toute instance de code VS que vous ouvrez, mais ils ne remplaceront pas les paramètres de l'espace de travail s'ils sont présents. En savoir plus sur la personnalisation des paramètres utilisateur et espace de travail .


3
Existe-t-il un moyen d'exclure les liens / alias sym?
granmoe

4
Pour masquer tous les modules node_modules dans les sous-dossiers, vous pouvez utiliser:"**/node_modules/**": true
supNate

3
Dans les versions ultérieures de VSCode (novembre 2017), vous utilisez Fichier> Préférences> Paramètres et utilisez la liste déroulante en haut à droite pour sélectionner UserSettings ou Workspace. La sélection de Workspace créera ensuite le dossier .vscode et settings.json dans votre projet
Drenai

1
@becko, oui, vous devez redémarrer votre éditeur après avoir changé.
Johan Walles

3
Vous n'avez plus besoin de redémarrer VS Code pour que cela prenne effet.
MarredCheese

213

Parfois, vous souhaitez simplement masquer certains types de fichiers pour un projet spécifique. Dans ce cas, vous pouvez créer un dossier dans votre dossier de projet appelé .vscodeet créer le settings.jsonfichier là-dedans (ie .vscode/settings.json). Tous les paramètres de ce fichier affecteront uniquement votre espace de travail actuel.

Par exemple, dans un projet TypeScript, voici ce que j'ai utilisé:

// Workspace settings
{
    // The following will hide the js and map files in the editor
    "files.exclude": {
        "**/*.js": true,
        "**/*.map": true
    }
}

8
VS Code a maintenant un onglet lorsque vous allez dans Préférences> Paramètres où vous pouvez basculer entre les paramètres utilisateur et les paramètres de l'espace de travail, de sorte que vous n'avez plus à créer manuellement le fichier vous-même. Excellent exemple d'exclusion de types de fichiers - merci!
Tim Franklin

24

L' extension " Make Hidden " fonctionne très bien!

Make Hidden offre plus de contrôle sur le répertoire de votre projet en activant des menus contextuels qui vous permettent d'effectuer des actions de masquage / affichage sans effort, un explorateur du volet d'affichage pour voir les éléments cachés et la possibilité d'enregistrer des espaces de travail pour basculer rapidement entre les éléments masqués en vrac.


23

Pour les .metafichiers lors de l'utilisation de Unity3D, j'ai trouvé que le meilleur modèle de masquage est:

"files.exclude": {
  "*/**/**.meta": true
}

Cela capture tous les dossiers et sous-dossiers et sera repris foo.cs.metaen plus defoo.meta


5
A travaillé pour les .pycfichiers générés par python .
Dominic Motuka

3
Cela fonctionne, mais la recherche globale cesse de fonctionner avec une erreur Error parsing glob ... invalid use of **; must be one path component"*/**/*.meta": true
:,

20

Je voudrais également recommander l'extension vscode Peep , qui vous permet de basculer masquer sur les fichiers exclus dans vos projets settings.json.

Appuyez sur F1pour la ligne de commande vscode (palette de commandes), puis

ext install [enter] peep [enter]

Vous pouvez lier "extension.peepToggle" à une clé comme Ctrl+ Shift+ P(identique à celle F1par défaut) pour un basculement facile. Appuyez sur Ctrl+ K Ctrl+ Spour les raccourcis clavier, entrez peep, sélectionnez Peep Toggle et ajoutez votre reliure.


17

Le __pycache__dossier et les *.pycfichiers sont totalement inutiles pour le développeur. Pour masquer ces fichiers de la vue de l'explorateur, nous devons modifier le fichier settings.json pour VSCode. Ajoutez le dossier et les fichiers comme indiqué ci-dessous:

"files.exclude": {
  ...
  ...
  "**/*.pyc": {"when": "$(basename).py"}, 
  "**/__pycache__": true,
  ...
  ...
}

3

Si vous travaillez sur une application Angular 2+ , et comme moi vous aimez un environnement de travail propre, suivez la réponse @ omt66 et collez ce qui suit dans votre fichier settings.json. Je vous recommande de le faire une fois la configuration initiale terminée.

Remarque : Cela masquera également le dossier .vscode (avec settings.json). (Ouvrez dans votre explorateur de fichiers / éditeur de texte natif si vous devez apporter des modifications par la suite)

https://pastebin.com/X2NL6Vxb

{
    "files.exclude": {
        ".vscode":true,
        "node_modules/":true,
        "dist/":true,
        "e2e/":true,
        "*.json": true,
        "**/*.md": true,
        ".gitignore": true,
        "**/.gitkeep":true,
        ".editorconfig": true,
        "**/polyfills.ts": true,
        "**/main.ts": true,
        "**/tsconfig.app.json": true,
        "**/tsconfig.spec.json": true,
        "**/tslint.json": true,
        "**/karma.conf.js": true,
        "**/favicon.ico": true,
        "**/browserslist": true,
        "**/test.ts": true
    }
}

0

Cela ne me convient peut-être pas si bien, mais si vous sélectionnez d'abord tous les fichiers auxquels vous souhaitez accéder en appuyant dessus dans la barre latérale, afin qu'ils apparaissent en haut de votre écran, par exemple: script.js, index. html, style.css. Fermez tous les fichiers dont vous n'avez pas besoin en haut.

Lorsque vous avez terminé, vous appuyez sur Ctrl + B sur Windows et Linux, je ne sais pas ce que c'est sur Mac.

Mais là vous l'avez. s'il vous plaît n'envoyez pas de haine

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.