Hide .map and .js files in VS Code when doing TypeScript

VS Code Preferences

Visual Studio Code is an open source code editor developed by Microsoft for Windows, Linux and OS X. It includes support for debugging, embedded Git control, intelligent code completion (also known as IntelliSense), and other features. It is also customizable, so users can change the editor's theme, change the editor's keyboard shortcuts, change the editor's preferences, and others.

Ok, so much for the Microsoft marketing speech :).
I replaced sublime with VSCode a while back and I must say I am really impressed by it thus far. It is blazing fast. Not just fast, blazing fast. It has tons of cool features and it is completely customizable.
VSCode is a small Visual Studio if you will; an IDE that behaves, looks and loads (!) like a source code editor!
If you haven't checked it out yet I strongly advise you to do so now! -don't worry I'll wait a bit before continuing ;)-

Typescript

One of the things I tend to do with VSCode is TypeScript. As you may know, when you're doing TypeScript each '.ts' file gets 'transpiled' into two other files. So you'll have a '.map' file, a '.ts' file and a '.js' file. When you're programming you are only interested in the '.ts' file though, the others just clutter up your workspace.
Here's how you make VSCode hide these file:

Edit the user (or workspace) settings by clicking File > Preferences.

VS Code Preferences

You should get two views. The left (read-only) view contains the default settings while the right contains settings that override the default ones. So you change settings by copying them from the left to the right.

Paste the following json configuration in the right view:

"files.exclude": {
   "**/.git": true,
   "**/.DS_Store": true,
   "**/*.js.map": true,
   "**/*.js": {"when": "$(basename).ts"}
}

This will hide '.js.map' files all-together (don't need them) and hide '.js' files that have corresponding '.ts' files.

You might enjoy


These are exiting times front-end engineers. The three biggest frameworks are all either approaching or have had major new…

I believe code reviews to be one of the most important things to improve your level of technical skill…

Tim Sommer

I'm a Web Developer with +7 years of experience in the .Net framework, with a focus on HTML5 and JavaScript.

Belgium, Antwerp
comments powered by Disqus
OWIC
Member of The Internet Defense League