While I was exploring Angular 2, following their Tour of Heroes tutorial, I was excited to see it is using TypeScript. As we know, TypeScript is not directly supported by browsers. It has to be transpiled into JS code for it to work. Good thing, the guys at Google has come up with a startup kit when developing Angular application ( instruction how to get it here ). Now you dont have to worry about manually transpiling TypeScript codes to JS, the package will do that for you and a lot more ( BrowserSync, yeah). With that being taken care of, you only have to worry about your TS code. Because the transpiled files reside on the same folder, these files may cloud up your Visual Studio Code file list. I asked StackOverflow ( Google for devs haha ) and got a working solution, pronto!
FileList Before the Fix
The Fix
- Edit VSCode Preferences.
- Edit Settings. This will open the settings.json file. You can either edit the User Setting or the Workspace Setting.
- Search for the "files.exclude"
- Add the following values :
"**/*.js.map": true, "**/*.js": {"when": "$(basename).ts"}
Note : The extra arguments on the last entry make sure that we only hide JS files when a file with the same base name but with a TS extension is present.
The Resulting List
Now you can concentrate on the TypeScript files. Enjoy coding!
Comments