This is the 27th day of my participation in the August Genwen Challenge.More challenges in August

1.auto close tag

Automatically close HTML tags

2.auto rename tag

When modifying a label, the closed label is automatically modified

3.beautify

Beautify the code

4.Bracket Pair Colorizer

This extension allows matching parentheses to be colored. The user can define the characters to match and the colors to use

5.Change Case README

One-key binding allows quick change of case

6.Chinese (Simplified) Language Pack for Visual Studio Code

This Chinese (Simplified) language pack provides a localization interface for VS Code

7.Code Runner

Run code snippets or code files in multiple 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# scripts, C# (.net Core), VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml scripts, R, AppleScript, Elixir, Visual Basic.net, Clojure, Haxe, Objective-C, Rust, Racket, Scheme, AutoHotkey, AutoIt, Kotlin, Dart, Free Pascal, Haskell, Nim, D, Lisp, Kit, V, SCSS, Sass, CUDA, Less and custom commands

8.Color Highlight

This extension styles CSS/Web colors found in documents.

9.CSS Peek

This extension supports all the normal features of symbol definition tracing, but can be used with CSS selectors (classes, ids, and HTML tags). This includes:

  • Quick view: Load the CSS file inline and edit it quickly there. (Ctrl+Shift+F12)
  • Go to: Jump directly to the CSS file or in a new editor (F12) to open it
  • Hover: Will define hover over the symbol (Ctrl+hover)

In addition, it supports Symbol Providers, so if you already know the class or ID name, you can quickly jump to the correct CSS/SCSS/LESS code

10.Debugger for Chrome

Use to debug JavaScript code in Google Chrome or other targets that support the Chrome DevTools protocol.

11.ESLint

Code specification

12.HTML Snippets

This extension adds rich language support for VS Code HTML tags, including:

  • Complete HTML5 tags
  • color
  • fragment
  • [Partially implemented] Quick information
  • The instructions mention whether the tag is deprecated

13.Image preview

Display image preview while binding line is hovering

14.IntelliSense for CSS class names in HTML

  • Auto-complete CSS class definitions found in the workspace (defined in CSS files or file types listed in the Supported Language Patterns section)
  • Supported bylinkAn external stylesheet referenced by elements in an HTML file
  • Manually re-cache commands for class definitions used in autocomplete
  • User Settings to override folders and files that should be considered or excluded during caching

15.language-stylus

  • Syntax highlighting
  • Symbol provider
  • Completion of selectors, properties, values, variables, functions, etc.
  • Color preview

16.Live Server

  • Quick Development Live Server with Live browser reloads.
  • Start or stop the server by clicking on the status bar.
  • Open the HTML file to the browser from the Explorer menu. Quick Gif demo.
  • Support to exclude files for change detection.
  • Hotkey control.
  • Customizable port number, server root directory, default browser.

17.minapp

Smart completion of wechat applet tags and attributes (supports native applet, MPvue and WEpy frameworks with snippets)

18.npm Intellisense

Visual Studio Code plug-in that automatically completes the NPM module in the import statement.

19.open in browser

Use the Alt + B shortcut to open the current HTML file in the default browser, or Shift + Alt + B to select a browser.

20.Path Autocomplete

  • It supports relative paths (beginning with a./)
  • It supports absolute paths to the workspace (beginning with /)
  • It supports absolute paths to file systems (beginning with C:)
  • It supports paths relative to user folders (beginning with ~)
  • It does this bypath-autocomplete.excludedItemsOption supports item exclusion
  • It supports NPM packages (starting with AZ, not relative to disk)
  • Automatic suggestion is supported after folder selection
  • It does this bypath-autocomplete.pathMappingsOption supports custom mapping
  • It supports passingpath-autocomplete.transformations
  • It supports Windows pathspath-autocomplete.useBackslash

21.Path Intellisense

Auto complete file name

22.Slack Theme

Classic color theme

And an imaginary dark eggplant classic.

23.SQL Server (mssql)

  • Connect to Microsoft SQL Server, Azure SQL database, and SQL data warehouse.
  • Create and manage connection profiles and recently used connections.
  • Write T-SQL scripts using IntelliSense, go to “Definitions”, T-SQL code snippet, syntax coloring, T-SQL error validation andGOBatch separator.
  • Execute the script and view the results in an easy-to-use grid.
  • Save the result as a JSON or CSV file and view it in the editor.
  • Customizable extension options, including command shortcuts.

24.Vetur

  • Syntax highlighting
  • fragment
  • Emmet
  • Collation/error checking
  • formatting
  • Done automatically
  • Component data: Auto-complete and hover information for popular Vue frameworks and your own custom components
  • Experimental interpolation features: Vue template auto-complete, hover information and type check
  • VTI: The surface template type check error occurs on the CLI

25.vscode weapp api

Provides wechat applets API tips and code snippets for VSCode

26.vscode wxml

Provides WXML syntax support

27.vscode-fileheader

Add comments to file titles and support automatic updating of file modification times.

28.vscode-icons

icon

29.vscode-wechat

30.vue

31.wechat-snippet

32.Vue 3 Snippets Highlight Formatters And Generator

To format code, you can select Shift + Alt + F to format code

33.any-rule

Regular expression library