How to exclude all but certain files in the sidebar in Visual Studio Code? - visual-studio-code

Using Microsoft's Visual Studio Code, how do I show only certain files and file patterns in the sidebar and exclude all other files?
I want to show .yml files to achieve editing only them and not to scroll through all files.
I tried this, but it didn't work.
"files.exclude": {
"**/*": true,
"**/*.yml": false
}
P.S. I understand there is a way to hide certain files, but I want to show only specific files. I don't mind using an extension to achieve this.

This will get you pretty close:
"files.exclude": {
"**/*.[^y]*": true,
"**/*.y[^m]*": true,
"**/*.ym[^l]*": true
}
It should exclude all files except those starting with a .ym(etc.) extension, like .yml, .ym, .ymabcdef, etc. I don't know if you have any other files besides .yml that match that pattern. I think right now this is as close as you can get to what you want. The last entry doesn't seem to actually do anything though it should!!

Related

Visual Studio Code - WordWrap only specific file formats

Is there a way to make Visual Studio Code Word-Wrap only specific files (.py, .cpp, etc) and not utilities formats such as .txt, .json, etc?
I just started working on a project and I need to process a lot of txt files and it's annoying not seeing how the content of the file is structured because of the Wordwrap setting.
Yes, this can be done by customizing your settings.json. The quickest way is to use the command palette (CTRL or CMD)+P and begin typing configure language
followed by the file type you are specifically looking to alter
you can then customize the settings as needed. The code below can be added to your settings.json file to make JSON and .txt files always use word wrapping by default
{
...
"[plaintext]": {
"editor.wordWrap": "on"
},
"[json]": {
"editor.wordWrap": "on"
}
}
more information can be found in the official docs

Why is my node_modules folder greyed out after command 'npm install'?

I wonder why my node_modules folder is greyed out in my VS Code editor after I run the command npm install.
Here the picture of my folder:
Files/folders that are included in .gitignore are greyed out. Normally node_modules folder is included within .gitignore.
It's because your node_modules folder is referenced in your .gitignore file.
Visual Studio tells you that this folder is ignored by the version control by graying it out.
As was already pointed out, VSCode automatically ignores everything in .gitignore. However, it also explicitely ignores some folders by default. All of this can be configured. Here are the steps you might want to take:
Check out the official documentation on Workspace settings
Open the relevant settings (you can choose between User (global) and Workspace). I usually do this via CTRL (or Command on Mac) + SHIFT + P -> > settings, which will show you the relevant choices: . For each you can either choose the UI or the JSON variant.
Also make sure to check the default settings via Peferences: Open Default Settings (JSON). You will find that, as of now (May 2021), **/node_modules is also automatically excluded, independent of other ignore files. Currently the default settings look like this:
// Configure glob patterns for excluding files and folders in fulltext searches and quick open. Inherits all glob patterns from the `files.exclude` setting. Read more about glob patterns [here](https://code.visualstudio.com/docs/editor/codebasics#_advanced-search-options).
"search.exclude": {
"**/node_modules": true,
"**/bower_components": true,
"**/*.code-search": true
},
// Controls whether to use global `.gitignore` and `.ignore` files when searching for files.
"search.useGlobalIgnoreFiles": false,
// Controls whether to use `.gitignore` and `.ignore` files when searching for files.
"search.useIgnoreFiles": true,
Enabling searching node_modules
"search.exclude": {
"**/node_modules": false
},
"search.useIgnoreFiles": false
WARNING: This will slow down things a lot since node_modules takes forever to search through - at least during cold start, that is when things are not cached. (Note that it is difficult to estimate how their caching works since it keeps evolving over time.)
To mitigate this, you might want to add some additional search.exclude settings. Note you will have to explicitely list everything you don't want, because...
The big shortcoming of VSCode search
search.exclude does not support:
negative look-ahead/behind
mutually cascading queries
Things like this will not work!
// does NOT work! :((
"search.exclude": {
"**/node_modules/#types": false,
"**/node_modules": true
}
This is a MAJOR problem which has been heavily discussed in the almost famous issue #869 for 6 years already! Join in and add to the 100+ comments! :)
Update: As of 2021/8/14, the issue has been taken off the backlog queue and put in the On Deck queue (but that also might not mean much).

How to list all files with certain extension

Is it possible to list all files who have a certain extension in the sidebar in VS Code?
i.e. all files with .js extension?
VS Code has a files.exclude setting. In theory, you should be able to exclude everything and then override that setting for .js files exclusively. That would look something like this:
{
"files.exclude": {
"**/*": true,
"**/*.js": false,
},
}
Unfortunately the expected behavior does not align with the actual results, but there is an open issue regarding this exact feature.

Use VSCode Language specific settings for .min.js

Visual Studio Code Version 1.10 adds the ability to specify languages settings on a per language basis (*1). You put something like this in your settings.json file:
"[javascript]": {
"editor.fontSize": 100,
}
I'd like to do something more specific. I'd like to apply different rules to files that match *.min.js.
How would I do that?
I've actually got something that works, but it's a bit hacky, so I thought I'd ask.
*1) In case you want to know which ones: Use autocomplete after typing in "[]":, or see languageIds array in this file.
I'm aware beautify skips formatting min files by default. But just using "editor.formatOnSave": true, this doesn't seem to happen. Also, other non-formatting stuff like wordwrap is nice.
Here's my current solution:
"files.associations": {
"*.min.js": "javascriptreact"
},
// Hijack javascriptreact to create custom settings for min.js files
"[javascriptreact]": {
"editor.formatOnSave": false,
"editor.wordWrap": "on"
}
I'm using the fact that vscode happens to have a second type of javascript, one that isn't used my my project. Not ideal, but it seems to work.

How to exclude all files except certain file type/s in VSCODE?

How to exclude all files except certain file type/s in vscode? Since it is not supporting ! in glob pattern, I tried following setting but didn't work neither.
{
"files.exclude": {
"**/*.*": true,
"**/app.config": false
}
}
Also, I saw that there is a feature request in here but it is a year old issue. So wondering if StackOverflow community has any update on it.