Heim  >  Artikel  >  Entwicklungswerkzeuge  >  Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

青灯夜游
青灯夜游nach vorne
2021-04-01 10:34:363830Durchsuche

In diesem Artikel werden 13 praktische VSCode-Plug-ins vorgestellt, um die Entwicklungseffizienz zu verbessern und die Kopfschmerzen beim Schreiben von Code zu beseitigen. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Empfohlenes Lernen: „vscode-Tutorial

1. Codelf

Variable Naming Artifact变量命名神器

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

2、View In Browser

在浏览器里面预览正在编辑的html文件

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

3、Color Highlight

高亮显示样式颜色

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

4、Bracket Pair Colorizer

成对的彩色括号,让括号拥有独立的颜色,便于区分

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

5、Highlight Matching Tag

高亮显示对应的HTML标签以及标识出对应的各种括号

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

6、Path Intellisense

在编辑器中输入路径的时候,能自动补全

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

推荐学习:《vscode教程

7、Prettier - Code formatter

格式化代码

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

8、Auto Close Tag

自动补全标签

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

9、Auto Rename Tag

自动重命名html标签,如修改p标签为a,将自动修改结尾标签p为a

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

10、HTML Snippets

智能提示HTML标签,以及标签的含义

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

11、HTML CSS Support

在HTML标签上写Class的时候能够智能提示当前所支持的样式

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

12、indent-rainbow

带颜色的缩进

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

13、change-case

转换命名风格

Bildbeschreibung hier einfügen🎜🎜Bildbeschreibung hier einfügen🎜🎜🎜🎜🎜2. Im Browser anzeigen🎜🎜🎜Vorschau der HTML-Datei, die im Browser bearbeitet wird🎜🎜Bildbeschreibung hier einfügen🎜🎜Bildbeschreibung hier einfügen🎜

🎜3、Color Highlight🎜

🎜High Highlight-Stilfarbe code>🎜🎜<img src="https://img.php.cn/upload/article/000/000/024/dc7969b06aee38ecc0d93236a0ba9275-5.png" alt="Bildbeschreibung hier einfügen">🎜🎜<img src="https://img.php.cn/upload/article/000/000/024/bfcb9588f01e45a027670c859ef297c2-6.png" alt="Bildbeschreibung hier einfügen">🎜🎜🎜4 , Bracket Pair Colorizer🎜🎜🎜Paare farbiger Klammern, sodass Klammern zur einfachen Unterscheidung unabhängige Farben haben können🎜🎜Bildbeschreibung hier einfügen🎜🎜Einfügen Bildbeschreibung hier🎜🎜🎜5. Markieren Sie das passende Tag🎜🎜🎜Markieren Sie das entsprechende HTML-Tag und identifizieren Sie die entsprechenden Klammern 🎜🎜Bildbeschreibung hier einfügen🎜🎜Bildbeschreibung hier einfügen🎜🎜🎜6, Path Intellisense🎜🎜🎜Bei der Eingabe des Pfades im Editor kann dieser automatisch vervollständigt werden 🎜🎜Bildbeschreibung hier einfügen🎜🎜Hier Bildbeschreibung einfügen🎜🎜Empfohlenes Lernen: „🎜vscode-Tutorial🎜“🎜🎜🎜 7. Prettier – Code-Formatierer🎜🎜🎜Code formatieren🎜🎜Bildbeschreibung hier einfügen🎜🎜Bildbeschreibung einfügen hier🎜

🎜8. Auto-Close-Tag🎜

🎜Auto-Complete-Tag 🎜🎜Bildbeschreibung hier einfügen🎜🎜9, Tag automatisch umbenennen🎜🎜HTML-Tag automatisch umbenennen. Wenn Wenn Sie das p-Tag in a ändern, wird das End-Tag p automatisch in a geändert🎜🎜Bildbeschreibung hier einfügen🎜

🎜10, HTML-Snippets🎜

🎜Intelligente Eingabeaufforderungen für HTML-Tags und ihre Bedeutung🎜🎜Bildbeschreibung hier einfügen🎜

🎜11. HTML-CSS-Unterstützung🎜🎜Wenn Class in das HTML-Tag geschrieben wird, können die aktuell unterstützten Stile intelligent aufgerufen werden 🎜🎜Bildbeschreibung hier einfügen🎜

🎜12 , indent-rainbow🎜

🎜Farbiger Einzug🎜🎜Bildbeschreibung hier einfügen🎜🎜Bildbeschreibung hier einfügen🎜

🎜13, case-change🎜

🎜 Benennungsstil konvertieren🎜

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Mit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !

Weitere Programmierkenntnisse finden Sie unter: Programmiervideo! !

Das obige ist der detaillierte Inhalt vonMit 13 praktischen VSCode-Plug-Ins werden Sie beim Schreiben von Code keine Kopfschmerzen mehr haben! !. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:csdn.net. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen