30 Visual Studio Code plugins that greatly improve development efficiency

Our VSC (VSCode) will be like a unicorn with five lasers that can emit lasers! Next, I will introduce the very useful plugins I use every day.

If you are still a newcomer to VSC, click on the button at the bottom left to install the plugin.

Material Theme

Downloads: 1.3 million

The longest theme of Visual Studio Code!

Auto Import

Downloads: 460,000

Automatically find, analyze, and then provide code completion. Available for TypeScript and TSX.

Import Cost

Downloads: 410,000

The plugin will display the size of the imported package at the end of the line. To calculate the packet size, the plugin uses Webpack and babili-webpack-plugin.

Indent-Rainbow

Downloads: 130,000

A simple plugin makes alignment more readable.

IntelliSense for CSS class names in HTML

Downloads: 2.43 million

Based on your project and linkexternal files referenced by tags, the smart plugin provides completion of the CSS class name in HTML.

SVG Viewer

Downloads: 290,000

A plugin for previewing SVG.

Prettier

Downloads: 357 million

You must not have this plugin missing, you need it to beautify your JavaScript/TypeScript/CSS code with one click.

 

React Native Tools

Downloads: 2.18 million

Code hints, debugging, commands to integrate RN.

 

Sublime Text Keymap and Settings Importer

Downloads: 760,000

From the download volume, it seems that many people have moved from Sublime Text.

 

This plugin changes the shortcut key binding of visual studio code to be the same as Sublime Text 3. You can try it: cmd + P (Mac), ctrl + P (Windows).

 

You can jump to the file. If you add >symbols before searching , you can even search for actions, such as opening a built-in terminal, installing plugins, and more.

For those who are used to using ST3, this is a big plus.

npm Intellisense

Downloads: 880,000

The VSCode plugin can automatically complete the npm module name in the import statement.

 

lit-html

Downloads: 30,000

In JavaScript/TypeScript files, if HTML tags are used, lit-html provides syntax highlighting and corresponding completion support.

 

highlight-matching-tag

Downloads: 60,000

This should have been a feature that VSCode should provide by default, highlighting the matching tags.

 

GitLens

Downloads: 7.72 million

Don’t say anything, just directly on the map!

 

Git Project Manager

Downloads: 370,000

Git Project Manager allows you to search and open a Git-managed project directly with one click.

 

Git History

Downloads: 3.32 million

Used to view the git history of a git log or a file, compare different branches, commits.

File Utils

Downloads: 80,000

Provides a more concise way to create, copy, move, rename, and delete files/folders.

 

Bracket Pair Colorizer

Downloads: 2.28 million

If your code has a lot of callbacks, this highlighting can help you better distinguish between different code blocks.

Color Highlight

Downloads: 250,000

Visually show the colors you define.

CSS Peek

Downloads: 230,000

You can locate its definition in the HTML by CSS id or class.

 

Debugger for Chrome

Downloads: 11.11 million

Use Chrome to debug your JavaScript code, or other platforms that support the Chrome Debugger protocol.

Quokka.js

Downloads: 1.72 million

Execute JavaScript code in real time (useful for making quick demos).

Trailing Spaces

Downloads: 70,000

Highlight those redundant spaces and quickly delete them.

TypeScript Hero

Downloads: 720,000

Help with children’s shoes programmed with TypeScript!

 

Time

Downloads: 240,000

Generate data reports from your usage habits.

winter

Downloads: 4.51 million

Vue tool under VS Code! With the development of Pine Wu, it has accumulated more than 4 million downloads!

Code Runner

Downloads: 3.46 million

Support for immediate execution of code in multiple languages. Supported languages: C, C++, Java, JavaScript, PHP, Python, Perl, Perl 6, Ruby, Go, Lua, Groovy, PowerShell, BAT/CMD, BASH/SH, F# Script, F# (.NET Core), C# Script, C# (.NET Core), VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml Script, R, AppleScript, Elixir, Visual Basic .NET, Clojure, Haxe, Objective-C, Rust, Racket, AutoHotkey , AutoIt, Kotlin, Dart, Free Pascal, Haskell, Nim, D.

PHP IntelliSense

Downloads: 4.15 million

vscode-icons

Downloads: 7.99 million

Icon collection.

Is

Downloads: 290,000

Feel free to use Facebook’s Jest.

 

React.js code snippets

Downloads: 590,000

It is very convenient to develop the React.js application with the ES6 syntax.

 

other vscode plugins introduction:

VScode easy to use plugin collection

how do efficient developers personalize vscode plugins andconfigurations?