VS Code | How to hide Spec.ts/ Test files from Sidebar File explorer

In the Angular project, we usually see spec.ts files in our application folders. These are test files which are not used most of the times. Also whenever we create a new Service, Component or any Directive, using the generate command in Ng CLI tool, these are created by default.

However, we can skip the creation of Spec.ts file by adding --skipTests=true option flag in our generate commands like these:

But it’s always cool to have fewer files in your Sidebar file explorer. In VS code we have a lot of features and preferences which proves very useful if we know how to use them.

Here I will discuss a trick to hide Spec.ts files from your sidebar. You only need to add a filter for files which you don’t want to see in you sidebar files stack.

How to hide Spec.ts Files?

Step 1) Open VS Code, then for to Files>> Preferences>> Settings

 

Step 2) Now under the User tab, open Text Editor tree menu then hit Files.

 

Step 3) Scroll down to see Exclude section, here you will see a list of file extensions which are already hidden using wildcard characters.

Just click on “Add Pattern” button, then add **/*.spec.ts, hit Ok. That’s it!

This simple trick can hide any file extension from the sidebar. There are also many tricks in VS code which can help to make development easy.

Thanks for visiting :) Let me know if you have some suggestions or feedback for this post in the comment section. Looking for any tutorial or demo on FreakyJolly, just drop me a message here

Leave a Reply

avatar
  Subscribe  
Notify of