Table of contents
VS Code is one of the most popular editors/IDEs out there (see, for instance, WakaTime 2020 Programming Stats, Stack Overflow 2021 Developer Survey & Python Developers Survey 2020 Results). It is currently my favourite code editor – I use it for almost everything!
In this post, I present a list of VS Code extensions that I generally depend on, and always ensure that they are installed in my favourite text editor! So, without further ado, here we go ...
General Purpose ⚙️
Spell Checking ✍🏽
streetsidesoftware.code-spell-checker
– Code Spell Checker › Spelling checker for source code
Comments 💬
aaron-bond.better-comments
– Better Comments › Improve your code commenting by annotating with alert, informational, TODOs, and more!
Changelogs 📜
axetroy.vscode-changelog-generator
– changelog-generator › An extension to generate changelog.
Add a splash of colour 🎨
CoenraadS.bracket-pair-colorizer-2
– Bracket Pair Colorizer 2 › A customizable extension for colorizing matching bracketskamikillerto.vscode-colorize
– colorize › A vscode extension to help visualize css colors in files.naumovs.color-highlight
– Color Highlight › Highlight web colors in your editoroderwat.indent-rainbow
– indent-rainbow › Makes indentation easier to read
Lorem ipsum ❇️
deerawan.vscode-faker
– vscode-faker › Generate fake data for name, address, lorem ipsum, commerce and much more
Coding style 📄
EditorConfig.EditorConfig
– EditorConfig for VS Code › EditorConfig Support for Visual Studio Codeesbenp.prettier-vscode
– Prettier - Code formatter › Code formatter using prettierHookyQR.beautify
– Beautify › Beautify code in place for VS Code
Code execution 🚀
formulahendry.code-runner
– Code Runner › Run C, C++, Java, JS, PHP, Python, Perl, Ruby, Go, Lua, Groovy, PowerShell, CMD, BASH, F#, C#, VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml, R, AppleScript, Elixir, VB.NET, Clojure, Haxe, Obj-C, Rust, Racket, Scheme, AutoHotkey, AutoIt, Kotlin, Dart, Pascal, Haskell, Nim, ...
Metrics 📈
WakaTime.vscode-wakatime
– WakaTime › Metrics, insights, and time tracking automatically generated from your programming activity.
Git 🗃️
rubbersheep.gi
– gi › Generating .gitignore files made easy
Screen capture 📸
pnp.polacode
– Polacode › 📸 Polaroid for your code
Miscellaneous Tools 🛠️
alefragnani.Bookmarks
– Bookmarks › Mark lines and jump to themGruntfuggly.todo-tree
– Todo Tree › Show TODO, FIXME, etc. comment tags in a tree viewhumao.rest-client
– REST Client › REST Client for Visual Studio Codekisstkondoros.vscode-gutter-preview
– Image preview › Shows image preview in the gutter and on hovertombonnike.vscode-status-bar-format-toggle
– Formatting Toggle › A VS Code extension that allows you to toggle the formatter (Prettier, Beautify, …) ON and OFF with a simple click.wmaurer.vscode-jumpy
– jumpy › Jumpy provides fast cursor movement, inspired by Atom's package of the same name.
Themes 💄
akamud.vscode-theme-onedark
– Atom One Dark Theme › One Dark Theme based on AtomPKief.material-icon-theme
– Material Icon Theme › Material Design Icons for Visual Studio Codesdras.night-owl
– Night Owl › A VS Code theme for the night owls out there. Now introducing Light Owl theme for daytime usage. Decisions were based on meaningful contrast for reading comprehension and for optimal razzle dazzle. ✨vscode-icons-team.vscode-icons
– vscode-icons › Icons for Visual Studio Code
Language Support ✨
asciidoctor.asciidoctor-vscode
– AsciiDoc › Provides rich language support for AsciiDoc.attilabuti.vscode-mjml
– MJML › MJML preview, lint, compile for Visual Studio Code.bibhasdn.django-html
– Django Template › Django template language support for Visual Studio Codebungcip.better-toml
– Better TOML › Better TOML Language supportDart-Code.dart-code
– Dart › Dart language support and debugger for Visual Studio Code.Dart-Code.flutter
– Flutter › Flutter support and debugger for Visual Studio Code.DotJoshJohnson.xml
– XML Tools › XML Formatting, XQuery, and XPath Tools for Visual Studio CodeGrapeCity.gc-excelviewer
– Excel Viewer › View Excel spreadsheets and CSV files within Visual Studio Code workspaces.IBM.output-colorizer
– Output Colorizer › Syntax highlighting for log filesidleberg.nsis
– NSIS › Language syntax, IntelliSense and build system for Nullsoft Scriptable Install System (NSIS)lextudio.restructuredtext
– reStructuredText › reStructuredText language support (RST/ReST linter, preview, IntelliSense and more)mikestead.dotenv
– DotENV › Support for dotenv file syntaxms-dotnettools.csharp
– C# › C# for Visual Studio Code (powered by OmniSharp).ms-vscode.cmake-tools
– CMake Tools › Extended CMake support in Visual Studio Codems-vscode.cpptools
– C/C++ › C/C++ IntelliSense, debugging, and code browsing.naco-siren.gradle-language
– Gradle Language Support › Add Gradle language support for Visual Studio CodeNativeScript.nativescript
– NativeScript › NativeScript support for Visual Studio Coderedhat.vscode-yaml
– YAML › YAML Language Support by Red Hat, with built-in Kubernetes syntax supportredhat.vscode-xml
– XML › XML Language Support by Red Hatsamuelcolvin.jinjahtml
– Better Jinja › Syntax highlighting for jinja(2) including HTML, Markdown, YAML, Ruby and LaTeX templatesshanoor.vscode-nginx
– nginx.conf › Syntax highlighter for nginx conf files.Syler.sass-indented
– Sass › Indented Sass syntax Highlighting, Autocomplete & Formattertwxs.cmake
– CMake › CMake langage support for Visual Studio Codewilliam-voyek.vscode-nginx
– NGINX Configuration › Syntax highlighting for NGINX configuration filesxshrim.txt-syntax
– Txt Syntax › highlight text files(.txt, .out .tmp, .log, .ini, .cnf ...) and provide general utility tools for text documentsXadillaX.viml
– VimL (Vim Language, Vim Script) › Vim Script language support for VSCode.
Snippets 🎉
bibhasdn.django-snippets
– Django Snippets › Common Django snippets for everyday useKeno.uikit-3-snippets
– UIkit 3.0 Snippets › UIkit 3.0 Snippets based on official documentationmsaelices.nativescript-vue-snippets
– NativeScript-Vue Snippets › Snippets for Telerik's NativeScript mobile framework with Vuesdras.vue-vscode-snippets
– Vue VSCode Snippets › Snippets that will supercharge your Vue workflowtsvetan-ganev.nativescript-xml-snippets
– NativeScript XML Snippets › XML snippets for Telerik's NativeScript cross-platform mobile applications development framework.xabikos.JavaScriptSnippets
– JavaScript (ES6) code snippets › Code snippets for JavaScript in ES6 syntax
Containers 🚢
ms-azuretools.vscode-docker
– Docker › Makes it easy to create, manage, and debug containerized applications.ms-vscode-remote.remote-containers
– Remote - Containers › Open any folder or repository inside a Docker container and take advantage of Visual Studio Code's full feature set.
Python 🐍
ms-python.python
– Python › IntelliSense (Pylance), Linting, Debugging (multi-threaded, remote), Jupyter Notebooks, code formatting, refactoring, unit tests, and more.ms-python.vscode-pylance
– Pylance › A performant, feature-rich language server for Python in VS Codems-toolsai.jupyter
– Jupyter › Jupyter notebook support, interactive programming and computing that supports Intellisense, debugging and more.
TeX ✒️
geoffkaile.latex-count
– latex-count › A word counter for latex files (.tex)James-Yu.latex-workshop
– LaTeX Workshop › Boost LaTeX typesetting efficiency with preview, compile, autocomplete, colorize, and more.
Web development 🌐
christian-kohler.npm-intellisense
– npm Intellisense › Visual Studio Code plugin that autocompletes npm modules in import statementsecmel.vscode-html-css
– HTML CSS Support › CSS Intellisense for HTMLdbaeumer.vscode-eslint
– ESLint › Integrates ESLint JavaScript into VS Code.eg2.vscode-npm-script
– npm › npm support for VS Codelonefy.vscode-JS-CSS-HTML-formatter
– JS-CSS-HTML Formatter › Format, prettify and beautify JS, CSS, HTML code by using shortcuts, context menu or CLIms-vscode.sublime-keybindings
– Sublime Text Keymap and Settings Importer › Import Sublime Text settings and keybindings into VS Code.ms-vscode.vscode-typescript-tslint-plugin
– TSLint › TSLint support for Visual Studio Coderitwickdey.LiveServer
– Live Server › Launch a development local Server with live reload feature for static & dynamic pagessidthesloth.html5-boilerplate
– HTML Boilerplate › A basic HTML5 boilerplate snippet generator.stylelint.vscode-stylelint
– stylelint › Modern CSS/SCSS/Less linterwebhint.vscode-webhint
– webhint › Run webhint in Visual Studio Code.Zignd.html-css-class-completion
– IntelliSense for CSS class names in HTML › CSS class name completion for the HTML class attribute based on the definitions found in your workspace.
Markdown 📝
DavidAnson.vscode-markdownlint
– markdownlint › Markdown linting and style checking for Visual Studio Codems-vscode.Theme-MarkdownKit
– Markdown Theme Kit › Theme Kit for VS Code optimized for Markdown. Based on the TextMate themes.ms-vscode.wordcount
– Word Count › Markdown Word Count Example - a status bar contribution that reports out the number of works in a Markdown document as you interact with it.yzhang.markdown-all-in-one
– Markdown All in One › All you need to write Markdown (keyboard shortcuts, table of contents, auto preview and more)
Vue.js 💚
sdras.vue-vscode-extensionpack
– Vue VS Code Extension Pack › A collection of extensions for working with Vue Applications in VS Codeoctref.vetur
– Vetur › Vue tooling for VS Code
Android 📱
jeroen-meijer.pubspec-assist
– Pubspec Assist › Easily add and update dependencies to your Dart and Flutter project.richardwillis.vscode-gradle
– Gradle Tasks › Run Gradle tasks in VS Code
Well, there you have it! What VS Code extensions do you depend on that aren't on this list? Do you have alternatives to some of the extensions I've listed? Well, let me know in the comments below 🙂.