DEV Community


Posted on • Updated on


How To Recommend VSCode Extensions

I'm a big fan of VSCode's ability to store configurations as JSON files in the workspace or repository itself, allowing us to share them with colleagues. Similar to how we see .eslintrc or .prettierrc files as part of the repository to enforce the same rules and styles for all collaborators, we can also share the same settings with others by storing them in a settings.json file inside the .vscode folder. We use this file to hide certain folders like node_modules, but also to centrally configure extensions like ESLint (I'm referring to the VSCode extension, not the NPM package).

That brings me directly to the reason for this post. If you work in a team, you may also want to use the same tools for your editor. There are certainly advantages to having everyone working with a similar development workflow and toolset. VSCodes allows us to collect these extensions by their IDs in an extensions.json file. Below is an example from us:


When the repository is first opened, the following popup appears to notify the user that there are recommended extensions.

VSCode Extension Recommendations Popup

The option to show the recommendations leads to the marketplace with an overview of these extensions. It is also possible to check them later by searching for the tag @recommended.

Show Recommended Extensions

I think it's a great feature of VSCode to store this information (i.e. settings, extensions, etc.) close to the actual code in the repository and thus securely controlled by a version control system.

Top comments (0)

Need a better mental model for async/await?

Check out this classic DEV post on the subject.

⭐️🎀 JavaScript Visualized: Promises & Async/Await

async await