[VScode] Front-end essential plug-ins (full)

Base

Chinese (Simplified)

• Chinese (Simplified) language pack for VS Code
  

Auto Close Tag

• Auto-close HTML/XML tags
  

Auto Rename Tag

• Automatically rename the paired HTML/XML tags to complete the synchronous modification of the tags on the other side

Path Intellisense

• Automatically prompts the file path, supports various quick import files, and supports automatic completion
  

Bracket Pair Colorizer

• Add different colors to the brackets to distinguish different blocks
  

JavaScript(ES6) code snippets

• ES6 syntax intelligent prompts and fast input, in addition to js, ​​it also supports .ts, .jsx, .tsx, .html, .vue, eliminating the need to configure it to support various js code files
  

HTML CSS Support

• Let the html tag write class to intelligently prompt the styles supported by the current project
  

beautify

• format code tool
  

Prettier - Code formatter

• Code formatter using prettier

ESlint

• JavaScript code detection, JavaScript code style detection, JavaScript code automatic formatting

Vue plugin

Winter

• Vue multi-functional integration plugin, including: syntax highlighting, smart prompt, emmet, error prompt, formatting, auto-completion, debugger.

Vue 3 Snippets

• Vue IntelliSense, Vue.js 3 and Vue.js 2 snippet extension

Vue VSCode Snippets

• Code fragment references, such as input, vbaseautomatically create the code structure of the Vue file
  

Vue Language Features (Volar)

• Language support for Vue 3

React plugin

ES7+ React/Redux/React-Native snippets

• Use ES7+ syntax in JS/TS. And extend React, React-native and Redux. customizable. Built-in integration with prettier.

Simple React Snippets

• There are many built-in React fragments, for specific use cases, go to vscodes to view

ssh plugin

Remote - SSH

• Use SSH to open any folder on a remote machine and take advantage of the full feature set of VS Code.

Remote - SSH: Editing Configuration Files

• Edit the SSH configuration file

Git plugin

Gitlens: Prompt for commit records

• Choose a file arbitrarily, which line of code you click with the mouse, you will be prompted who did what and when, and the author, version, and time will be directly displayed on the mouse hover prompt
  

Git History: view git history

• View git log, file history, compare branches or commits
  

Git History Diff: Compare git history

• View git history. View diffs for committed files. View git blame information. View storage details.

extension (optional)

Image Preview

• Move the mouse to the path to display the image preview. For example, src is bound to an image address, and the image can be displayed by hovering over the path

jQuery Code Snippets

• jQuery Code IntelliSense