Visual Studio Code extensions let you add a range of powerful features including different languages, debuggers, and tools to your installation to support your development workflow. We have picked our top 10 extensions that we’re sure you’ll love too!
1. Peacock
The Peacock extension lets you customize each project so you have some visual feedback on what you are currently working on.
Installation link here.
2. Bracket Pair Colorizer 2
The extension allows matching brackets to be identified with colours. The user can define which characters to match and what colours to use.
Installation link here.
3. GitLens
Effortlessly explore the history and evolution of a code base with GitLens. Easily see who changed a line or code block, why, and when. Jump back in time to gain further insights into how and why the code evolved.
Installation link here.
4. Auto Rename Tag
As the name suggests, Auto Rename Tag renames the second tag as the first one is updated and vice versa.
Installation link here.
5. Code Spell Checker
In most cases, spelling mistakes in variable, function, and package names cause developers to get errors. In addition, you may make spelling errors while writing a comment, description, or documentation. This package will highlight errors in your file.
Installation link here.
6. Snippets
Using snippets will save you time and make you more productive. This is not just a single extension, but a collection of extensions with snippets for different programming languages.
Installation links here:
7. Better Comments
This tool allows you to write more human-friendly comments in your code. This helps you and someone reading your code to benefit from clear, digestible comments.
Installation link here.
8. Prettier
As one of the most popular code formatters, Prettier is a powerful opinionated code formatter. Consistent styles and formatting throughout your code can greatly reduce time spent on editing and collaborating with other developers. Below is an example before and after Prettier:
Installation link here.
9. SVG Viewer
An SVG file is a text file that stores vector images for the web. A text editor displays the textual content of the SVG file if you use it to edit it. If you intend to edit these files directly, you can view them in an image editor.
Installation link here.
10. Import Cost
With Import Cost, you can see the estimated size of the import package in your code. When working on a project, keeping track of additional dependencies facilitates the process of avoiding user experience compromise.
Installation link here.
About the author:
Ann Mary Jacob is an Application Developer at AOT Technologies. Her areas of expertise include Python, Vue, Nodejs, and Typescript. Besides being a techie, she’s fond of gardening and sports.