Microsoft’s Visual Studio Code provides developers with a robust marketplace packed with useful tools and extensions that make VS Code even more functional and customizable to meet every developer’s needs. New extensions are added regularly, and you can find tools, libraries of snippets, and just about anything else you could want to streamline the development process. In fact, Stackify Prefix has its own code extension in the Marketplace — the easiest and most powerful .NET profiler you’ll find.
Extensions are a vital part of the Visual Studio Code experience. We decided to take a little tour of the other offerings in the Marketplace to come up with a list of 50 most helpful, must-try extensions (in addition to Stackify Prefix, which we, of course, consider a must-have) for any Visual Studio Code enthusiast. All of the following 50 extensions are free, although some require you to have other programs or services installed. We hope you’ll find some great ideas in this list of tools.
If you’re doubtful about your TypeScript quality, verify it with this Visual Studio code extension, which integrates the tslint linter for TypeScript language into VS Code.
- Checks the quality of your static TypeScript code
- Analyzes the whole project or a particular section of your code
- Allows you to auto fix errors when scanning lines of code
- Supports automated fixing of warnings
- Requires tslint (installed globally or locally)
A Visual Studio code extension that automatically finds parses and provides you with code actions and code completions for every import you have, Auto Import works with TypeScript and TSX.
- Easily scans code in large projects
- Import status bar show you the number of imports available
- Merge imports from the same location
Docker is one of the hottest trends in development today, and if you use Visual Studio Code, you don’t want to miss out. This is the official Docker extension to help you create dockerfiles and add syntax highlights, commands, and snippets to them.
- Makes creating and launching containerized applications easy
- Automatically generates dockerfile and docker-compose.yml
- Dockerfile and docker-compose commands are built into the command palette
- Syntax highlighting and hover tips
- Snippets and linting for dockerfile files
Keyboard shortcuts don’t just save time but enable you to maintain your flow as you code. They’re very popular with Visual Studio users, and this extension makes it possible to use your favorite VS keyboard shortcuts in VS Code.
- Provides the traditional Visual Studio keyboard shortcuts
- Easy to add your custom shortcuts
- Brings shortcuts of Windows, Linux, and Mac to Visual Studio code
- Find all keyboard shortcuts in the extension’s contribution list
Maintain a consistent coding style with this Visual Studio code extension. Even if your teams use multiple IDEs and editors, consistency is achievable with EditorConfig for VS Code. Internally, EditorConfig uses the editorconfig npm package, one of the few EditorConfig cores available. Check out the main EditorConfig site here.
- Official release by EditorConfig for Visual Studio
- Define styles for indenting, tabs, and where lines begin and end
- Text editor plugins for editors to read and follow defined style rules
- Uses editorconfig npm package
Evernote is one of the most popular note taking apps. It can be used to improve the quality and efficiency of your coding with the Evermonkey extension. This handy Visual Studio Code extension enables Markdown support for Evernote, following the same principles as Sublime Text but with a faster experience.
- Provides support for Evernote in Visual Studio Code
- It caches data locally to avoid repetitive net requests for a faster experience
- UI design updates to be added to improve viewing
- Quick access to snippets by pressing Ctrl+Space
- Assists with boilerplate as well
- Works with other targets that support Chrome debugging protocol
- Sets breakpoints even on source files when source maps are enabled
- Debugs script tags and eval scripts as they add added
- Locals pane, watches, and console
- Uses the default JSHint configuration as described on their site
- All files are included in this extension by default
- Allows you to exclude specific files and folders from the review
- Option to disable JSHint for specified workspaces
Write great C# code for .NET Core with this extension, powered by OmniSharp. It even debugs your code and supports a variety of operating systems. VS Code aims to be a useful tool for cross-platform C# development, and in fact, many Unity game developers use VS Code rather than the MonoDevelop IDE, making this C# extension a particularly useful tool for many developers.
- Supports debugging and lightweight development tools for .NET Core
- Editing support for C# including syntax highlighting, IntelliSense, Go to Definition, Find All References, and more
- C# debugger available on Windows, Mac, and many Linux operating systems
If you have trouble parsing TODOs in the working files of your project, this Visual Studio code extension can help. It lets you parse multi-line TODOs and makes your workflow a lot more actionable.
- TODO counter is available in the status bar of your current document
- The counter provides list of all available TODOs
- Option to parse single and multiple TODOs at once
- Supports any programming language
PowerShell is a great object-oriented programming language. If you use this programming language, this is a must-use extension offering PowerShell language support for Visual Studio Code.
- Write and debug PowerShell scripts in VS Code’s IDE-like interface
- Works on platforms like Windows, Linux, and iOS
- Provides tools to find variables and cmdlets references
Use this Visual Studio code extension to add code snippets of Angular (v2 or higher), TypeScript or HTML to your editor. It’s an incredibly easy-to-use extension that streamlines coding productivity.
- Adds Angular version 2 and up, TypeScript or HTML code snippets
- Multiple snippets provided in the description for both TypeScript and HTML
- Instantly improve productivity in Angular 2 and up with these snippets
Sublime Text is an excellent text editor for coding. If you are used to Sublime Text keyboard shortcuts and want to use them in VS, this extension brings the most popular Sublime Text keyboard shortcuts to Visual Studio code.
- Extension officially released by Microsoft to import keyboard shortcuts
- Imports the popular Sublime Text keyboards shortcuts used in programming
- Brings keyboard shortcuts used on Windows, Linux and Mac
As awesome as CSS is, it’s hard to remember all CSS classes. This extension auto-completes CSS class names as you type, based on the CSS files in your workspace.
- Customize the directories where the extension will search for files
- Provides manual re-caching for class definition auto completion
- Provides support for PHP, Razor, and Jade
If you like viewing your HTML in a browser frequently for feedback as you code, this Visual Studio code extension will help you do it. It renders HTML files in your system’s default browser.
- Provides two options to edit, one from context menu and another from command
- Set your default browser according to your preference
- Supports Mozilla, Chrome, Internet Explorer and Safari
Get NgBootstrap snippets, which consist of Angular and Bootstrap 4 snippets, with this helpful extension.
- Typing ngb gives a quick list of the snippets available
- Unfolds snippets as soon as you press enter
- Provides alerts, dropdown, progressbar and many other snippets
- Provides a quick list of all the snippets after typing ‘jq’
- Sets single or multiple attributes from the matched elements
- Snippets have been added from the 2015 Visual Studio jQuery Snippets
Bower makes building apps easy with its package management capabilities, providing access to most Bower commands within VS Code. With the Bower Visual Studio Code extension, you can install, uninstall, search for, and update packages effortlessly.
- Interactive Bower command prompts have been built in the IDE
- Write, install and uninstall bower.json and other Bower packs
- Find files according to the files you are editing
Git is the most popular version control system today. It enables distributed version control for modern web apps. Sometimes, you want to be able to re-trace your code to its previous versions and restore that version. The Git History extension gives you the complete Git history, including a history of inline files, all within Visual Studio Code.
- Shows history in graphs and charts according to your preference
- Get multiple history graphs to create a comparison
- Keyboard shortcuts are provided for quick and easy history viewing
Scaffolding can be an important first step when building an app, but it can be complex. This Visual Studio extension lets you quickly scaffold Angular file templates.
- Supports non Angular-cli file structure
- Also supports angular-cli.json with different style extensions
- Provides good support for app structure
Previewing markdown files in a parallel window can be a pain due to the need to repeatedly type ‘Ctrl + K V’ or ‘Cmd + KV’. With the help of this Visual Studio Code extension, you can get automatic previews of the Markdown files you open.
- Latest version supports Visual Studio code 1.10.0 and higher
- Removes the need to press ‘Ctrl + K V’ for a preview of the Markdown file
- Shows previews next to the Markdown file you open
Save time when coding using the snippets you get with this Visual Studio code extension, which adds snippets for Angular for TypeScript and HTML.
- Works with Visual Studio 0.10.1 and higher
- Has been updated for Angular v4.0.0 release
- Keyboard shortcuts to activate snippets from within the editor
- Uses ESLint library from the opened workspace folder
- Documentation for ESLint is provided for new ESLint users
- Searches global version of the file if the library doesn’t have one
If different brackets confuse you, this Visual Studio code extension will help you match brackets with color-coding options. You can define which characters to match as well as preferred colors.
- Allows custom characters in custom brackets to be configured
- List of various colors available even for orphaned brackets
- New brackets can be added or removed from the list
MySQL is a very helpful database tool. This extension helps you develop and connect various systems to the database you use, which helps your team access data more efficiently.
- Customizable command shortcuts and extension options
- Allows you to create and manage various connection profiles
- Connects to SQL Data warehouse, Azure SQL Database, and Microsoft SQL Server
- Evaluate scripts and view results in a grid
- Save results to JSON or .csv file format to see in the editor
If the simplistic Visual Studio does not appeal to you, this extension adds icons to VS Code, making it more visually appealing and fun to work in. This extension was originally created to enable icons before VS Code began supporting them for files and folders. Now that VS Code does support icons, VScode-Icons aims to provide the most comprehensive set of icons available.
- Provides a complete set of icons to choose from in VS Code
- User can make icons look different and change the extension association at will
- Allows suggestions to add to the growing icon list
For programmers using the new Angular 2+ and need a supporting snippet extension, this Visual Studio extension is the one you need.
- Provides about 89 Angular 2+ snippets (and growing)
- Snippets are updated for versions 2.4.11 and 4.0.0
- Snippets of TypeScript, HTML, ngRx and code examples are available
- Suggests Angular 2 solutions when Angular 1 keywords are entered
- Adds every missing import in one command
- Fixes coding errors with a feature called ‘Light bulb.’
- Sort and organize your imports and remove unused imports
If you have a hard time remembering the path of a file, Path Intellisense can help. It auto-completes filenames as you work, saving you both time and energy.
- Autocomplete feature fills in the file path as you type
- Hidden files can be made visible with a simple setting
- Names with dashes are also shown in autocomplete
HTMLHint is a static code analysis tool that can be used with an IDE to improve the quality of code. If you’re looking to use HTMLHint in Visual Studio Code, there’s an extension for that.
- Highlights errors in the HTML file with squiggles
- Reports numbers of errors on status bar for easy viewing
- Provides options to set and define rules for checking
Tired of endlessly scrolling through your code, or using a ‘Ctrl + F’ to find that exact line of code you need to fix? This Visual Studio code Bookmarks extension makes creating and jumping through code easy and smooth.
- Set bookmarks anywhere in your code for easy access later
- Autocomplete feature makes navigating to your bookmarks easy
- Bookmarks are saved on your current project in sessions
- Bookmarks are restored on reopening the file
Get the Office UI Fabric Snippets support to create HTML document with this Visual Studio code extension. It has many UI elements that can be easily added to your code.
- Supports UI Fabric 3.0.0 Beta 2
- Lists available after typing Fabric while coding
- Provides overall change to the HTML document
- Breadcrumbs, buttons, callouts, date picker and label are some of many snippets available
Program using Haskell causally or as an expert using this Visual Studio extension that enables support for Haskell development.
- Supports Haskell and Cabal (.hs and .cabal)
- Code snippets for structures and popular functions
- Provides complete all round support for Haskell developers
- Customizable according to the preference of the user
- Autocomplete feature to make finding snippets easy
- Quickly toggle through different highlighted placeholder by pressing tab
- Provides snippets for users of Angular 1
- Quick and easy search for snippets
- Keyboard shortcuts to streamline your workflow
Many enterprise applications rely on Java. If you’re having trouble with developing or editing in Java in Visual Studio Code, this VS code extension will make your life easier by providing language support via Eclipse JDT Language Server, which utilizes Eclipse JDT, M2Eclipse and Buildship.
- Provides Java support through Eclipse JDT server language
- Shows status of language tools on lower right corner
- Provides details about failures in language coding
- Supports Maven, Gradle and Eclipse
- Code completion, code navigation, highlights, formatting, snippets and more
Microsoft Azure is one of the most popular cloud services used by developers and Ops teams to host and manage applications. Azure Functions is a powerful tool that lets you implement code based on event triggers, and the Azure Functions extension makes this possible in Visual Studio Code.
- Includes JSON IntelliSense for host and function
- Provides shortcut to quickly activate Intellisense
- Works on Visual Studio code 1.11.0 and higher
Apache Cordova is a popular mobile development framework. This Cordova extension assists in integrating commands, code-hinting and debugging for Apache Cordova within VS Code.
- Command palette finds errors in code and debugs them
- Uses Intellisense to work around plugin APIs
- Works smoothly with any project based on Cordova
- Added support for the Ionic framework
A favorite text editor of many programmers, Vim is now emulated in Visual Studio Code. This Vim extension makes writing and editing code easier.
- Multiple code commands combinations
- Possess a versatile command remapping capability
- Multiple Vim commands can be followed by multiple cursors
React Native is the popular mobile development framework open sourced by Facebook. This Reach Native extension lets you edit, develop, debug and integrate commands for React Native, providing a development environment for React Native projects.
- Creates an environment to support mobile project development
- Use command palette to debug and quickly run commands
- Use IntelliSense to browse parameters for React Native APIs
If you’re programming with PHP and are looking for an extension to help you debug your PHP code, PHP Debug is the VS Code extension you need, offering a variety of features to streamline development and ensure bug-free code.
- Acts as an adapter between VS code and XDebug
- Connects to remote debuggers as well
- Allows user to set breakpoints according to their preference (line, conditional, and function breakpoints)
- Break on entry or on uncaught exceptions and errors / warnings / notices
- Supports multiple, parallel requests
- Runs as CLI or without debugging
Code Runner is an extension that enables you to run any language’s code snippets in Visual Studio Code, with support for every popular programming language including both legacy languages and those that have gained popularity in recent years such as Clojure, Objective-C, Rust, Racket, AutoHotkey, AutoIt, and many others.
- Provides an Output Window to check the output of a snippet
- Supports a wide range of programming languages like C++, PHP, Clojure, Racket, Python and much more
- Custom commands
Generating and adding random data directly into your project, this Visual Studio extension does exactly what its name suggests. It uses the ChangeJS library and was inspired by the Random extension for Atom.
- Configures names, years, numbers, etc.
- Multiple commands can be accessed and worked
- Quick install and launch option
Apart from Jenkins, Travis is a widely known and used CI platform. Checking the build status of your code during the build stage is key. This Visual Studio code extension enables you to check your project’s Travis CI status without leaving VS Code.
- Small status indicator present in the status bar for convenience
- Update status and open in Travis are two default commands
- Uses a combination of repository/username to find test
This simple, useful Visual Studio code extension provides you with the option of wrapping the codes you select in HTML brackets.
- Wraps single or multiple inline selections
- Quick wrap shortcuts available
- Supports spaces and tabs for indentation
If you’re looking for a tool to help you see the Git Blame to view the revision history for your code, this Visual Studio code extension does just that. It appears in your status bar for easy access.
- Shows git blame information for selected lines
- Git blame information pings in the status bar
- Reduced text size for visibility
Reactjs is a popular open source UI framework released by Facebook. For the developers using Reactjs, this Visual Studio code extension provides snippets in ES6 syntax.
- Based on the bable-sublime-snippet package
- View already-installed snippets or add new snippets
Github Gist is a nifty way to share code and other pieces of text. With the Settings Sync extension, you can sync snippets, themes and other extensions across different machines using Gist.
- Single click upload and download
- Supports anonymous, Gist and Github account token to log in
- Synchronizes settings, snippets, extensions and themes
Switching between projects can become tiresome, slowing down your progress. This Visual Studio code extension makes the navigation process seamless, allowing you to multitask like a pro.
- Makes projects within Visual Studio easily accessible, and easy to switch between
- Scans projects and differentiates them according to code used
- Automatically caches the projects after scanning
These are a few of the many more extensions available in the Visual Studio Marketplace. Each extension serves a particular purpose in helping you program. They perform a variety of tasks like enabling you to add snippets, navigate through projects, use different programming language and add other features. We hope this list helps you and you find the extension you have been searching for and opens up your mind to the ways you can extend Visual Studio Code to simplify and supercharge your development.
- Constructing Test Cases That Don’t Suck (and How to Avoid Common Mistakes) - August 21, 2017
- 35 Leading PaaS Providers Offering Built-In Infrastructure and Scalability - August 21, 2017
- Biggest Mistakes Companies Make When Evaluating & Purchasing APM Software - August 18, 2017
- Why Security Should be Top-of-Mind for Developers - August 16, 2017