VS Code plugins relevant in 2023

VS Code by itself doesn’t have a lot of features and functionality. But this can be easily fixed with plugins that are available in the VS Code extension store. Under the cut are a few plugins that may be useful to developers. There is a lot here – from project management to “non-boring wallpapers”, i.e. design changes. Well, let’s go!

project manager

Nice and clear plugin name – it is immediately clear that it is intended for project management. The plugin allows you to view projects, switch and open if necessary. At the same time, you can open it with just one click.

There is one important nuance: Project Manager will not see the project if the Git repository is not initialized in it.

EditorConfig for VS Code

Well, this plugin provides support for .editorconfig files, which are responsible for the IDE settings within the current project. Among the settings are the size of the indents, the control of inserting an empty line, etc. A simple but quite practical plugin that is recommended by many developers.

GitLess and Git Graph

A great plugin that is a fork of GitLens known to many of us. It implements the implementation of a module in VS Code with the necessary tools for working with Git. The advantage of the plugin in the absence of advertising is what GitKraken has, for example.

Allows GitLess a lot. For example, work with commits, branches, history of project files, tags, connection to Git servers, stash storage, etc. Yes, and the plugin also allows you to quickly search for commits and compare them.

Well, what does Git Graph give? The plugin adds a widget with a Git graph. It visually visualizes the entire structure of the project branches, as well as the links between them. Accordingly, it is this useful feature that makes the plugin worthy of our recommendation selection.

IntelliCode and IntelliCode API Usage Examples

These plugins allow you to add AI assistance to the core features of VS Code.. In particular, after installing plugins, code completion starts working, just based on AI. Plus, tooltips appear that display tooltips with links to code from GitHub that is relevant to the project. And all this is directly in the process of work.

SVG

Everything is simple here, you can tell about the plugin in just one sentence: It adds language and syntax support to get started with SVG vector images. A very useful plugin, although relatively simple.

Gitignore

Everything is clear here too – the plugin adds support for .gitignore files. It also provides a large number of boilerplate .gitignore files. Thanks to this, they can be quickly and easily added to your project.

live server

This plugin allows you to reload the page after changes in JavaScript code, CSS and HTML markup. To launch, you need to hover over a line of code, right-click and select Open with Live Server.

Prettier-code formatter

The plugin allows you to bring almost any code into a readable form in a few seconds. It indents, wraps brackets, and generally solves most of the problems of bringing the code in order. In the end it looks pretty good. To launch this wonderful assistant, you need to perform a combination of pressing the buttons Ctrl + Shift + P. Nothing else is required.

eCSStractor

It greatly simplifies working with classes in CSS.. With it, a developer can select a whole HTML document or a part of it, and eCSStractor will automatically “pull out” the classes that you set for blocks and elements on the page from there. You just have to press Ctrl + V in the CSS file.

GitLens

One of the best extensions for working with Git. It provides the developer with the most complete information regarding the project repository. In addition, it also gives out information on the commits that were made and left.

The plugin makes it possible to easily monitor the code for new sections, indicating the comments that have been added for a particular section. Must have plugin for Git visualization.

Darcula Solid and Fluent Icons

Darcula Solid – dark theme with gray and orange tones. This design is based on the theme of the same name for WebStorm. But this is not a clone, but an improved version, with a number of improvements and adaptations that make the work more enjoyable.

Well, Fluent Icons is a set of icons that looks great in the VS Code interface.

color highlight

And another great plugin to improve visualization. It adds highlighting color codes. So, #ff0000 plugin highlights in red, and rgba(81, 21, 177) in purple. The plugin allows you to improve the perception of code with color codes, which is very useful when working with styles.

If you have your own plugins that you can recommend, tell us about them in the comments – we will complete the selection.