Share some commonly used plug-ins for VSCode development

This article will introduce and share with you some VSCode necessary common plug-ins for development. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to everyone.

Related recommendations: "vscode tutorial"

Visual Studio Code essential common plug-ins

Red is highly recommended, not to be missed o(∩_∩)o

---

• ##Chinese (Simplified) Language Pack for Visual Studio Code Simplified Chinese Package
  

• ##Prettier - Code formatter The strongest format , no rebuttal will be accepted (uninstall JS-CSS-HTML Formatter
  in the app store to avoid automatic formatting when saving)

• HTML Snippets Super practical and basic H5 code snippets and tips
  

• Code Runner Compile and run the code to see the results, supporting many languages
  

• GitLens Rich git log plug-in
  

• vetur vue syntax highlighting, IntelliSense, Emmet, etc.
  

• HTML CSS Support Let the html tag write class to intelligently prompt the styles supported by the current project. The new version already supports scss file retrieval, which is also one of the must-have plug-ins
  

• Auto Close Tag Match the tag and close the corresponding Label. Very practical【HTML/XML】
  

• Auto Rename Tag Modify the html tag and automatically help you complete the synchronization of the closing tag at the end Modify
  

• Path Intellisense Path Intellisense
  

• JavaScript (ES6) code snippets This plugin provides ES6 syntax support for JavaScript, TypeScript, HTML, React and Vue.
  

• Live Server The browser refreshes in real time. Right-click "Open With Live Server" to open
  

• open in browser View the html file from the browser, using the system's current Default Browser
  

• Bracket Pair Colorizer Let brackets have independent colors for easy differentiation. Can be used with any theme.
  

• ESLint ESLint code detection and verification
  

• vscode-icon Add icons to the vscode resource tree directory, a must-have product!
  

• Debugger for Chrome Let vscode map the debug function of chrome. Static pages can use vscode to break point debugging. True 666~
  

• IntelliSense for CSS class names in HTML Intelligently prompt the names in the css file in the project in html
  

• minapp Intelligent completion of WeChat applet tags and attributes (also supports native applet, mpvue and wepy frameworks, And provide snippets)
  

• CSS Peek Trace to the place where the CSS class is defined in the style sheet ctrl left mouse button Click class or right-click "Jump to definition (F12)"
  
  

• Manta's Stylus Supremacy Format stylus
  

• jQuery Code Snippets

  jquery essentials for severe patients
  

##Class autocomplete for HTML

• Friends who write HTML code, one of the main manifestations of HTML code is repetition. If you type it by hand, it will not only be tiring but also affect the progress of the project. This auto-complete plug-in is really great;
  

JavaScript Snippet Pack

• Plug-in for js, including common syntax keywords of js, very practical;
  

  ##Path Autocomplete
• Intelligent path completion

  
  

  beautify
• A tool for formatting code, which can format JSON|JS|HTML|CSS|SCSS, Easier to use than built-in formatting

  
  

  HTMLHint
• html code detection

  
  ##VSCode Great Icons

Another resource tree directory icon

• 
  colorize

will add a background to the current matching code color to the color code, very good

• Color Info
  Provides information about the colors you use in CSS. You can preview the color model (HEX, RGB, HSL and CMYK) information in the color block by simply hovering the cursor over the color.

• vscode-fileheader
  The top comment template can define the author, time and other information, and will automatically update the last modification time

• Document This
  js comment template (note: the new version of vscode has native support, enter /** tab on the function)

• filesize
  The current file size is displayed in the status bar at the bottom. After clicking, you can also see the detailed creation and modification time

• Bootstrap 3 Sinnpet
  Those who commonly use bootstrap can download

• VueHelper
  vue code tips

• Bookmarks
  A bookmark tool is still necessary

• tortoise-svn
  SVN integrated plug-in

Recommended Theme

Note: File-Preferences-Color Theme Set the switch

• Dracula Theme

• One Dark Pro

• monoka

For more programming related knowledge, please visit : Introduction to Programming! !

The above is the detailed content of Share some commonly used plug-ins for VSCode development. For more information, please follow other related articles on the PHP Chinese website!