vue3 使用什么 vscode 插件？

Question

vue3 使用什么 vscode 插件？

SF_XYZ

51

发布于
11 月 24 日上海

更新于
11 月 24 日

新手上路，请多包涵

我原先用的是 Vetur，在vue3的环境下用有一些问题

比如找不到某个模块，可能Vetur是给2用的，放在3会有一些不兼容的情况

代码高亮，语法提示是有了，就是这个在编译时报错运行时没啥毛病，看着有点不舒服:sweat。。
所以想问问有没有什么更好的插件推荐的
只要有代码提示，语法高亮，不要像上面这样报错的都行。。

vue3 vscode插件代码质量

阅读 996

AI BotBETA

针对Vue 3开发，在VS Code中有一些插件可以替代或补充Vetur，以提供更好的支持和功能。以下是一些推荐的插件：

Volar
- 描述：Volar是一个专为Vue 3设计的现代化插件，旨在替代Vetur并提供更好的支持。它特别针对Vue 3的新特性（如Composition API）进行了优化，并提供了更好的TypeScript集成和高性能代码提示。
- 功能：语法高亮、智能感知、自动补全、错误检查等。
Vue 3 Snippets
- 描述：这个插件提供了大量的Vue 3代码片段，用于快速生成常用的Vue.js代码。它支持Vue 3.x版本的代码片段，如模板、组件、钩子函数等，可以帮助开发者节省编码时间。
- 功能：快速插入代码片段、自定义片段等。
ESLint
- 描述：ESLint是一个JavaScript代码检查工具，它可以帮助开发者发现和修复代码中的问题，如语法错误、代码风格不一致等。在Vue.js项目中使用ESLint可以帮助规范代码风格，提高代码质量和可维护性。
- 功能：代码风格检查、错误提示、可配置性等。
Prettier
- 描述：Prettier是一个代码格式化工具，它可以帮助开发者自动格式化代码，使代码具有统一的风格。在Vue项目中使用Prettier可以让代码更加易读、易维护。
- 功能：自动格式化代码、支持多种语言（如JavaScript、CSS、HTML等）、与ESLint规则协调工作等。
Path Intellisense
- 描述：这个插件提供路径自动补全功能，可以快速找到文件和目录，减少手动输入路径的工作量。对于大型项目，路径自动补全能节省大量时间。
- 功能：路径补全、减少错误等。
Auto Import
- 描述：Auto Import插件可以自动导入需要的模块和组件。在使用新组件或函数时，它会自动添加import语句，减少手动操作，提高开发效率。
- 功能：模块自动导入、提高开发效率等。
Vue Peek
- 描述：Vue Peek插件允许开发者快速查看Vue组件中的模板、样式和脚本代码。通过按住Ctrl键并单击Vue组件的标签，可以跳转到相关的代码部分，方便理解和调试代码。
- 功能：快速查看Vue组件定义、支持在模板、样式和脚本之间轻松切换等。
Debugger for Chrome
- 描述：这个插件与Chrome调试器集成，方便调试Vue 3应用程序。它支持断点、监视变量等调试功能，有助于开发者在开发过程中快速定位和解决问题。
- 功能：断点调试、监视变量、集成Chrome调试器等。