Dieser Artikel stellt 6 VSCode-Plugins zusammen, die für die Vue3-Entwicklung unerlässlich sind. Sie können sie direkt über das VSCode-Plugin-Center installieren und verwenden.
1,53 Millionen Downloads+
Ich glaube, dass Studenten, die VSCode zur Entwicklung von Vue2 verwenden, mit dem Vetur-Plug-in als unterstützendem VSCode-Plug-in vertraut sein werden Seine Hauptfunktion besteht darin, Hervorhebung, Syntaxunterstützung und Syntaxerkennung für Vue-Einzeldateikomponenten bereitzustellen. [Empfohlenes Lernen: vscode-Tutorial, Programmierlehre, vuejs-Video-Tutorial]
Mit der Veröffentlichung der offiziellen Version von Vue3 empfiehlt das Vue-Team offiziell das Teilen von vscode-Plugins: 6 wichtige Plug-ins für die Vue3-Entwicklung-Plug-in als Ersatz für das Vetur-Plug-in. in, das nicht nur die Vue3-Sprachhervorhebung unterstützt, sondern auch die Syntaxerkennung unterstützt TypeScript und Typprüfungsfunktionen basierend auf vue-tsc.
Hinweis bei der Verwendung:
Deaktivieren Sie zunächst das Vetur-Plugin, um Konflikte zu vermeiden.
Es wird empfohlen, css
/less
zu verwenden / scss
als Sprache von <style></style>
, da diese auf basieren vscode-css-Languagecss
/less
/scss
作为 <style></style>
的语言,因为这些基于 vscode-css-language 服务提供了可靠的语言支持;
如果使用 postcss
/stylus
/sass
的话,需要安装额外的语法高亮扩展。postcss 使用 language-postcss,stylus 使用 language-stylus 拓展,sass 使用 Sass 拓展;
Teilen von vscode-Plugins: 6 wichtige Plug-ins für die Vue3-Entwicklung 不包含 ESLint 和 Prettier,而官方的 ESLint 和 Prettier 扩展支持 Vue,所以需要自行安装。
下载数 152 万+
Vue VSCode Snippets 插件旨在为开发者提供最简单快速的生成 Vue 代码片段的方法,通过各种快捷键就可以在 .vue
文件中快速生成各种代码片段。简直是 Vue3 开发必备神器。
该插件支持:Teilen von vscode-Plugins: 6 wichtige Plug-ins für die Vue3-Entwicklung、Vue2 和 Vue3。
使用方式如下:
.vue
文件,输入 vbase
会提示生成的模版内容:vfor
快速生成 v-for
指令模版:v3onmounted
快速生成 onMounted
-Dienst Bietet zuverlässige Sprachunterstützung; Wenn Sie postcss
/stylus
/sass
verwenden, müssen Sie es installieren zusätzliche Erweiterungen zur Syntaxhervorhebung. Postcss verwendet Sprache-postcss
-Erweiterung, sass verwendet die Sass-Erweiterung;
.vue
generieren. Es ist einfach ein unverzichtbares Artefakt für die Vue3-Entwicklung.
Wie folgt verwenden: 🎜🎜Erstellen Sie eine neue
.vue
-Datei, geben Sie vbase
ein und Sie werden mit dem generierten Vorlageninhalt aufgefordert: 🎜🎜🎜🎜vfor
ein, um schnell zu generieren v-for
Befehlsvorlage: 🎜🎜🎜🎜v3onmount
ein, um schnell die onMounted
-Lebenszyklusfunktion zu generieren: 🎜🎜🎜🎜🎜🎜Andere werden nicht mehr demonstriert. Die Funktion ist zu leistungsstark und es gibt viele häufig verwendete Tastenkombinationen. Insbesondere können Sie die 🎜Dokumentation🎜 anzeigen. 🎜🎜🎜🎜🎜3. Auto-Close-Tag🎜🎜🎜🎜Anzahl der Downloads: 7,69 Millionen+🎜🎜🎜🎜Das Auto-Close-Tag🎜-Plugin ist eine sehr nützliche VS-Code-Erweiterung, die einen großen Einfluss auf die Produktivität hat. Wie der Name schon sagt, wird das schließende Tag hinzugefügt, wenn wir die schließende Klammer in das schließende Tag eingeben. Es unterstützt HTML, Handlers, XML, PHP, Vue, JavaScript, Typescript, JSX und mehr. 🎜🎜🎜🎜🎜🎜🎜🎜4. Vue Peek🎜🎜🎜🎜Anzahl der Downloads: 490.000+🎜🎜Vue Peek Das Plug-in wird verwendet, um das Vue-Codebearbeitungserlebnis zu erweitern und ermöglicht uns einen schnellen Sprung zu Dateien, die durch Komponenten und Module definiert sind.
Verwendung wie folgt:
Über 89.000 Downloads . Vorschau und Debug von Anwendungen. Unterstützt das Starten, Erstellen und Neustarten von Projekten mit einem Klick.
Die 6 heute freigegebenen Plug-Ins können nach Bedarf installiert und verwendet werden. Wir empfehlen diese beiden Plug-ins wärmstens: Teilen von vscode-Plugins: 6 wichtige Plug-ins für die Vue3-Entwicklung
undVue VSCode Snippets.
Weitere Informationen zu VSCode finden Sie unter:vscode Basic Tutorial!
Das obige ist der detaillierte Inhalt vonTeilen von vscode-Plugins: 6 wichtige Plug-ins für die Vue3-Entwicklung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!