Hide Files

Hide Files allows the user to configure profiles to hide all files and folders that are not immediately needed. This makes it much easier to find relevant files.

Using Hide Files

Note: since Hide Files V2.1.0 the hide-files.json config is no longer present. Local configuration is managed via the VSCode workspace config.

Note: V2.1.1 fixed Hide Files on Linux and MacOS.

The GIF above shows everything required to use the basic functionality of Hide Files. You should be good to go! The rest of this file is for a more in-depth tutorial. I recommend reading it to get the most out of this extension, but it is not required.

A step by step introduction

Let's say you are working on a project with a few folders and files you never or very rarely need access to. The unfiltered project structure might look like this (I'm using a NextJS project as an example):

Most of the folders and files are not required and tend to slow you down when trying to find a file or folder. Let's remove them.

Setting up Hide Files

After installing Hide Files, a new view in the explorer will open (at the bottom):

Local setup (recommended)

Clicking Setup Hide Files: This is the recommended in most cases. It sets up Hide Files for the current workspace. All settings will be exclusively saved in the current workspace, and will therefore not be available in any other workspace.

When choosing the first option, all configuration will be save in the VSCode config for the current workspace (.vscode/settings.json).

Global setup

Clicking Setup Hide Files Globally: This sets Hide Files up for global use (global meaning across all projects/workspaces on your current machine). This can be useful if you mostly use one technology. If you, for example, primarily use NextJS, it might make sense to create a few global Hide Files profiles for NextJS so you don't have to repeatedly add all unnecesary files for each individual Hide Files configuration in your NextJS workspaces.

If you choose a global setup, the Hide Files config is stored in the VSCode Settings JSON. To acces it use the command Preferences: Open Settings (JSON) (Windows/Linux: Ctrl + Shift + P, MacOS: ⇧ + ⌘ + P)

Search for "hidefiles.globalConfig" to find the config.

Hiding Files

After setting Hide Files up, the Hidden Files view at the bottom of the explorer is available:

Profiles

Profile are optional. You can just use one profile and ignore this feature if you like.

Profiles are used to switch visibility between workspace folders. Each profile points to one workspace folder and can optionally define one or more pathBase entries to keep only specific top-level paths visible inside that folder.

Profiles can be also be helpful for big Monorepo projects. You can have a profile for client- and server developing and testing and switch between these profiles as needed.

The generated config is now folder-based. The extension manages .vscode/settings.json inside each workspace folder to show only the selected profile and hide the others.

Editing profiles

Editing and linking profiles is trivial. The GIF below shows how to delete the default profiles, and recreate them:

The config

This is information on the config format. It is not required to use the extension but can help with debugging. Please let me know should you run into any issues.

The newly generated config file will look as follows:

{
    "profiles": [
        {
            "name": "Admin",
            "folder": "ADMIN"
        },
        {
            "name": "Admin API",
            "folder": "ADMIN",
            "pathBase": ["apps/api", "packages/shared"]
        }
    ]
}

The format of the config is simple. It contains a list of profiles, and each profile has a name, a folder, and optionally pathBase and enabled.

Supported fields:

• name Profile label shown in the view
• folder Workspace folder path or name used by the profile
• pathBase Optional string or string array with the top-level paths that remain visible inside the selected folder
• enabled Optional boolean. When false, the profile is hidden from normal selection

Found an issue?

Please create an issue on GitHub or ask a question on the extensions page.