本教材由知了传课辛苦制作而成,仅供学习使用,请勿用于商业用途!如进行转载请务必注明出处!谢谢!

VSCode安装插件方式

vscode安装插件方法.png

VSCode插件推荐:

下面是使用VSCode开发Vue项目常用的插件,如果有更好的插件,欢迎在评论区补充。

1. Vetur

Vetur是用来识别.vue文件的,用来给.vue文件中的代码做语法高亮的。用VSCode开发Vue项目,这个插件是必装的!

2. ESLint

ESLint是专门针对Vue项目单独开发的一个代码规范的插件。在团队中协作开发中,推荐安装此插件,能统一代码风格。

3. Vue3 Snippets

是否有良好的代码自动补全功能,是评判一个开发工具好坏的一个核心要素。而Vue VSCode Snippets则是专门做这个事情的,他根据Vue项目语法,添加了一些代码片段,大大提高了我们编写Vue项目的效率。

4. Bookmarks

用于做标记的,在大型项目中,如果经常要在几个地方跳来跳去,那么可以使用Bookmarks来实现跳转。使用方式和快捷命令可以在安装Bookmarks的时候,查看他的介绍。

5. Bracket Pair Colorizer

某段代码太长的时候,我们通常是根据代码缩进,来寻找匹配的符号,但是Bracket Pair Colorizer可以通过颜色来进行配对,能节省我们寻找代码的时间,大大提高效率。效果如下:
Bracket Color插件效果.png

6. Auto Rename Tag

自动关闭标签,在开始标记的结束括号中键入后,将自动插入结束标记。
每当我们要更改HTML括号对中的一个标签(开始或结束标签)时,Auto Rename Tag会自动重命名另一个标签。
这个小的优化可以帮助防止很多错误,特别是在处理大型模板时。

7. Auto Close Tag

Auto Rename Tag标签类似,Auto Close Tag会自动生成结束标签。

8. Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code

VSCode汉化插件,如果用英文的不舒服,可以安装此插件,个人用来还是觉得很不错的!

9. VSCode-icons:

给文件和文件夹使用不同的图标,能增加美观度,也能增加识别度。
vscodeicons.png

以上便是作者平时常用的一些VSCode+Vue的插件,如果您觉得还有更好的,欢迎评论区留言~

909人已阅读,今天你学习了吗?

添加新回复