8 nützliche VSCode-Erweiterungstools, mit denen Ihr Codieren Spaß macht!

Mit den richtigen Werkzeugen können Sie Ihre Entwicklungsarbeit einfacher gestalten. Viele Entwickler verwenden VSCode als Entwicklungstool und VSCode ermöglicht die Installation verschiedener Erweiterungstools. [Empfohlen: vscode grundlegendes Tutorial]VSCode 作为开发工具，VSCode 允许安装各种扩展工具。【推荐：vscode基础教程】

Visual Studio Marketplace 上有太多的可用扩展工具，我们将着重介绍下面8个扩展工具。

即使是最简单的工具也能赋予人们力量去做伟大的事情--比兹·斯通

所有这些插件都可以在 Visual Studio Marketplace 上免费获得。

1. REST Client

REST Client 扩展工具允许你发送 HTTP 请求并直接在 VSCode 中查看响应。再也不需要使用外部应用程序向服务器发送 HTTP 请求。

这是一个非常流行的扩展工具，得到众多开发人员的青睐，获得了超过 100W 次的安装。另外我自己也使用这个插件已经有一段时间了，我觉得它很棒。

发送请求变得如此容易。语法非常简洁，并且提供了很多选项以满足你的需求。简单的 GET 请求只需要一行代码，GET 关键字后跟 URL 即可。

你真的应该尝试一下 REST Client 扩展工具。

2. CSS Peek

如果你是一个 web 开发人员，CSS Peek 绝对是必要的。有了这个扩展工具，将鼠标悬停在元素的类名或元素ID上，就可以看到应用于这个元素的 CSS 规则。

如下图所示：

这个扩展工具不仅仅允许你查看样式。它还有一个“转到”特性，允许你立即跳转到应用于元素的 CSS 规则。这为你节省了大量寻找正确选择器的时间。

3. Beautify

如果你喜欢整洁的代码，那么你肯定会喜欢 Beautify。

Beautify 支持 JavaScript，HTML，CSS，Sass 和 JSON。

这个扩展的最大优点是所有选项都是完全可定制的--比如缩进大小和文件是否应该以新行结尾。如果你用几种编程语言编写代码，那么 Beautify 可以涵盖。可以自定义每种编程语言的选项。

该扩展工具的下载量超过500W次，在最受欢迎的已安装扩展工具中排名前20位。

4. Auto Rename Tag

Auto Rename Tag 扩展工具所做的工作很简单，但是很好用。该扩展工具将自动重命名成对的 HTML 标签。如果你正在重命名一个开始标签，它将更改相应的结束标签；反之亦然。

如果你想在开始标签的结束括号中键入时自动添加结束标签，你应该看一看 Auto Close Tag 扩展工具。安装这两个扩展非常有用，将帮助你以更高效和一致的方式编写 HTML。

5. Quokka.js

Quokka.js

Visual Studio Marketplace Dort Es gibt so viele Erweiterungstools, dass wir uns auf die folgenden 8 Erweiterungstools konzentrieren werden.

Selbst die einfachsten Tools ermöglichen es Menschen, großartige Dinge zu tun – Biz Stone

Alle diese Plugins sind kostenlos auf dem Visual Studio Marketplace verfügbar.

1. Mit dem REST-Client

REST-Client-Erweiterungstool können Sie HTTP-Anfragen direkt in VSCode senden. Code > um die Antwort zu sehen. Keine Verwendung externer Anwendungen mehr zum Senden von <code>HTTP-Anfragen an den Server.

Dies ist ein sehr beliebtes Erweiterungstool, das von vielen Entwicklern bevorzugt wird und mehr als 1 Million Mal installiert wurde. Auch ich selbst nutze dieses Plugin schon seit einiger Zeit und finde es großartig.

Das Senden einer Anfrage ist so einfach geworden. Die Syntax ist sehr übersichtlich und bietet viele Optionen, die Ihren Anforderungen entsprechen. Eine einfache GET-Anfrage erfordert nur eine Codezeile, das Schlüsselwort GET gefolgt von URL.

Sie sollten unbedingt das Erweiterungstool REST Client ausprobieren. 🎜

2. CSS Peek🎜🎜Wenn Sie ein Web-Entwickler sind, ist CSS Peek unbedingt erforderlich. Mit dieser Erweiterung können Sie den Mauszeiger über den Klassennamen oder die Element-ID eines Elements bewegen, um die auf dieses Element angewendeten CSS-Regeln anzuzeigen. 🎜🎜Wie unten gezeigt: 🎜🎜🎜🎜🎜🎜Mit diesem Erweiterungstool können Sie nicht nur Stile anzeigen. Es verfügt außerdem über eine „Gehe zu“-Funktion, mit der Sie sofort zu der auf das Element angewendeten CSS-Regel springen können. Das erspart Ihnen viel Zeit bei der Suche nach dem richtigen Selektor. 🎜

3. Beautify🎜🎜Wenn Sie sauberen Code mögen, dann wird Ihnen Beautify auf jeden Fall gefallen. 🎜🎜Beautify unterstützt JavaScript, HTML, CSS, Sass und JSON. 🎜🎜Das Beste an dieser Erweiterung ist, dass alle Optionen vollständig anpassbar sind – etwa die Einzugsgröße und ob Dateien mit neuen Zeilen enden sollen. Wenn Sie in mehreren Programmiersprachen programmieren, ist Beautify genau das Richtige für Sie. Optionen für jede Programmiersprache können angepasst werden. 🎜🎜Diese Erweiterung wurde über 5 Millionen Mal heruntergeladen und zählt zu den 20 am häufigsten installierten Erweiterungen. 🎜

4. Tag automatisch umbenennen🎜🎜Tag automatisch umbenennen Die Arbeit des Erweiterungstools ist sehr einfach, aber sehr nützlich. Die Erweiterung benennt Paare von HTML-Tags automatisch um. Wenn Sie ein öffnendes Tag umbenennen, ändert sich auch das entsprechende schließende Tag und umgekehrt. 🎜🎜Wenn Sie automatisch ein schließendes Tag hinzufügen möchten, wenn Sie innerhalb der schließenden Klammer des öffnenden Tags tippen, sollten Sie sich die Erweiterung Auto Close Tag ansehen. Die Installation dieser beiden Erweiterungen ist sehr nützlich und wird Ihnen helfen, HTML effizienter und konsistenter zu schreiben. 🎜🎜🎜🎜🎜

5. Quokka.js🎜🎜Quokka .js ist eine In-Editor-Prototyping-Plattform, die Zugriff auf Projektdateien, Inline-Berichte und mehr bietet. Werte im Code werden zur Laufzeit aktualisiert und neben dem Code in der IDE angezeigt, während Sie ihn eingeben. 🎜🎜 Einfach großartig! 🎜🎜🎜🎜🎜🎜🎜🎜6. Welchen Wert hat die Optimierung von VS-Code ohne ein atemberaubendes Thema? Nicht viel, oder? ! Da Sie so viel Zeit mit VS-Code verbringen, sollten Sie dafür sorgen, dass es besser aussieht, indem Sie ein Theme installieren. 🎜🎜Das Night Owl-Theme ist ein wunderschönes Theme, das von vielen Entwicklern verwendet wird. Der Beschreibung dieses Themas zufolge ist es genau abgestimmt und optimiert für diejenigen unter uns, die gerne bis spät in die Nacht programmieren. 🎜🎜🎜🎜

Wenn Ihnen das Night Owl-Thema nicht gefällt, probieren Sie es aus: Pink Cat Boo, Panda Syntax, Mini Dark code>, <code>Gatito Theme, One Monokai, diese Themenfarben sind auch sehr schön~Night Owl 主题，安利一下： Pink Cat Boo， Panda Syntax, Mini Dark, Gatito Theme, One Monokai，这几个主题色也很好看~

7. JavaScript (ES6) code snippets

最后一个要介绍的扩展工具是 JavaScript (ES6) code snippets 扩展工具。该扩展工具有多个代码片段，可供您来生成ES6代码片段。
例如，键入clg然后按回车可以得到一个console.log。可能您需要一段时间来熟悉所有的代码片段，但是只要掌握了它，您就能非常快的打出ES6代码

8. TabNine

TabNine 是我用过的最好的代码补全工具，TabNine

7. JavaScript (ES6) Codeausschnitte h3>Das letzte Erweiterungstool, das eingeführt wird, ist das Erweiterungstool JavaScript (ES6)-Codeschnipsel. Die Erweiterung verfügt über mehrere Code-Snippets, die Sie zum Generieren von ES6-Code-Snippets verwenden können.

Geben Sie beispielsweise clg ein und drücken Sie die Eingabetaste, um ein console.log zu erhalten. Es kann eine Weile dauern, bis Sie sich mit allen Codeausschnitten vertraut gemacht haben, aber sobald Sie es beherrschen, können Sie ES6-Code sehr schnell eingeben

8 TabNine ist das beste Code-Vervollständigungstool, das ich je verwendet habe. TabNine ist ein automatisches Code-Vervollständigungstool, das auf künstlicher Intelligenz basiert. TabNine gibt die Wahrscheinlichkeit der Elemente an Sortiert nach Wahrscheinlichkeit. Zusätzlich werden die Quelle und die Adresse der Kandidatenelemente angegeben, was die Abfrage und das Lesen erleichtert. Es wurde bisher mehr als 30 W-mal heruntergeladen.

Okay, wenn du das siehst, bedeutet das, dass du wahre Liebe hast. Möchten Sie meinem

Github einen Stern hinzufügen?

Verwandte Empfehlungen:

Programmierunterricht🎜! ! 🎜🎜

Das obige ist der detaillierte Inhalt von8 nützliche VSCode-Erweiterungstools, mit denen Ihr Codieren Spaß macht!. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!