Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Windows, macOS and Linux. It comes with built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions for other languages (such as C++, C#, Java, Python, PHP, Go) and runtimes (such as .NET and Unity).
In this post, I will list some of the best extensions for VS Code that I use daily. I hope it will be useful for you.
1. GitLens
GitLens supercharges the Git capabilities built into Visual Studio Code. It helps you to visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more.
- Link: https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens
- Features:
- GitLens simply helps you better understand code. Quickly glimpse into whom, why, and when a line or code block was changed.
- Effortlessly navigate and explore Git repositories. Jump back through history or directly between commits and branches.
- Gain valuable insights through powerful comparison commands. Compare changes within a file, across commits, or between branches.
- Supercharge the Git capabilities built into Visual Studio Code — Visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more
- GitLens is an open-source extension for Visual Studio Code, created by Eric Amodio. While GitLens is generously offered to everyone free of charge, if you find it useful please consider supporting it.
2. Git Graph
View a Git Graph of your repository, and perform Git actions from the graph.
- Link: https://marketplace.visualstudio.com/items?itemName=mhutchie.git-graph
- Features:
- View a Git Graph of your repository, and perform Git actions from the graph.
- Git Graph is a free, open-source extension for Visual Studio Code. While Git Graph is generously offered to everyone free of charge, if you find it useful please consider supporting it.
3. Git History
View git log, file history, compare branches or commits.
- Link: https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory
- Features:
- View git log, file history, compare branches or commits
- Git History makes it easy to view the git log, file history, compare branches or commits in VS Code.
- Git History leverages the great Diff View built into VS Code. This allows for seamless comparisons of branches, commits, tags, and more.
- Git History is a free, open-source extension for Visual Studio Code. While Git History is generously offered to everyone free of charge, if you find it useful please consider supporting it.
4. Prettier - Code formatter
VS Code package to format your JavaScript / TypeScript / CSS using Prettier.
- Link: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
- Features:
- VS Code package to format your JavaScript / TypeScript / CSS using Prettier.
- Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.
- Prettier is a free, open-source extension for Visual Studio Code. While Prettier is generously offered to everyone free of charge, if you find it useful please consider supporting it.
5. ESLint
Integrates ESLint JavaScript into VS Code.
- Link: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
- Features:
- Integrates ESLint JavaScript into VS Code.
- ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code, with the goal of making code more consistent and avoiding bugs. In many ways, it is similar to JSLint and JSHint with a few exceptions:
- ESLint uses Espree for JavaScript parsing.
- ESLint uses an AST to evaluate patterns in code.
- ESLint is completely pluggable, every single rule is a plugin and you can add more at runtime.
- ESLint is a free, open-source extension for Visual Studio Code. While ESLint is generously offered to everyone free of charge, if you find it useful please consider supporting it.
6. Auto Rename Tag
Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.
- Link: https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag
- Features:
- Automatically rename paired HTML/XML tag, same as Visual Studio IDE does.
- Auto Rename Tag is a free, open-source extension for Visual Studio Code. While Auto Rename Tag is generously offered to everyone free of charge, if you find it useful please consider supporting it.
7. Live Server
Launch a development local Server with live reload feature for static & dynamic pages.
- Link: https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
- Features:
- Launch a development local Server with live reload feature for static & dynamic pages
- Live Server is a free, open-source extension for Visual Studio Code. While Live Server is generously offered to everyone free of charge, if you find it useful please consider supporting it.
8. Path Intellisense
Visual Studio Code plugin that autocompletes filenames.
- Link: https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense
- Features:
- Visual Studio Code plugin that autocompletes filenames
- Path Intellisense is a free, open-source extension for Visual Studio Code. While Path Intellisense is generously offered to everyone free of charge, if you find it useful please consider supporting it.
9. Material Icon Theme
Material Design Icons for Visual Studio Code.
- Link: https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme
- Features:
- Material Design Icons for Visual Studio Code
- Material Icon Theme is a free, open-source extension for Visual Studio Code. While Material Icon Theme is generously offered to everyone free of charge, if you find it useful please consider supporting it.
10. Live Share
Real-time collaborative development from the comfort of your favorite tools.
- Link: https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare
- Features:
- Real-time collaborative development from the comfort of your favorite tools
- Live Share is a free, open-source extension for Visual Studio Code. While Live Share is generously offered to everyone free of charge, if you find it useful please consider supporting it.
11. Settings Sync
Synchronize Settings, Snippets, Themes, File Icons, Launch, Keybindings, Workspaces and Extensions Across Multiple Machines Using GitHub Gist.
- Link: https://marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync
- Features:
- Synchronize Settings, Snippets, Themes, File Icons, Launch, Keybindings, Workspaces and Extensions Across Multiple Machines Using GitHub Gist.
- Settings Sync is a free, open-source extension for Visual Studio Code. While Settings Sync is generously offered to everyone free of charge, if you find it useful please consider supporting it.
12. Quokka.js
Live Scratchpad for JavaScript.
- Link: https://marketplace.visualstudio.com/items?itemName=WallabyJs.quokka-vscode
- Features:
- Live Scratchpad for JavaScript
- Quokka.js is a free, open-source extension for Visual Studio Code. While Quokka.js is generously offered to everyone free of charge, if you find it useful please consider supporting it.
13. Code Spell Checker
A basic spell checker that works well with camelCase code.
- Link: https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker
- Features:
- A basic spell checker that works well with camelCase code
- Code Spell Checker is a free, open-source extension for Visual Studio Code. While Code Spell Checker is generously offered to everyone free of charge, if you find it useful please consider supporting it.
14. Better Comments
Improve your code commenting by annotating with alert, informational, TODOs, and more!
- Link: https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments
- Features:
- Improve your code commenting by annotating with alert, informational, TODOs, and more!
- Better Comments is a free, open-source extension for Visual Studio Code. While Better Comments is generously offered to everyone free of charge, if you find it useful please consider supporting it.
15. Code Runner
Run code snippet or code file for multiple languages: C, C++, Java, JavaScript, PHP, Python, Perl, Perl 6, Ruby, Go, Lua, Groovy, PowerShell, BAT/CMD, BASH/SH, F# Script, C# Script, VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml Script.
- Link: https://marketplace.visualstudio.com/items?itemName=formulahendry.code-runner
- Features:
- Run code snippet or code file for multiple languages: C, C++, Java, JavaScript, PHP, Python, Perl, Perl 6, Ruby, Go, Lua, Groovy, PowerShell, BAT/CMD, BASH/SH, F# Script, C# Script, VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml Script
- Code Runner is a free, open-source extension for Visual Studio Code. While Code Runner is generously offered to everyone free of charge, if you find it useful please consider supporting it.
16. REST Client
REST Client allows you to send HTTP request and view the response in Visual Studio Code directly.
- Link: https://marketplace.visualstudio.com/items?itemName=humao.rest-client
- Features:
- REST Client allows you to send HTTP request and view the response in Visual Studio Code directly.
- REST Client is a free, open-source extension for Visual Studio Code. While REST Client is generously offered to everyone free of charge, if you find it useful please consider supporting it.
Disclaimer: This list is not a ranking, it's just a list of extensions that I use and I think it's useful for you. All of them are free and open-source. If you find it useful, please consider supporting the authors. Thanks for reading!