当前位置:   article > 正文

vscode常用插件_vscode必备插件

vscode必备插件

1. chinese(汉化编译器)

chinese插件适用于 VS Code 的中文(简体)语言包,此中文(简体)语言包为 VS Code 提供本地化界面。

https://img-blog.csdnimg.cn/direct/445d9545a61449cf941973c9a55de7d2.png

2vetur(vue 2开发必备)volar(vue 3开发必备)

vetur volar插件是一个专门用于开发 Vue.js 项目。它提供了许多有用的功能,包括语法高亮、代码补全、错误检查、格式化、调试等。

https://img-blog.csdnimg.cn/direct/f6c677a2a5d64db19205277aac3042dd.png

https://img-blog.csdnimg.cn/direct/d8a718a65bc8473790005d44c54c4e87.png

3Prettier - Code formatter(格式化代码)

Prettier - Code formatter 插件会自动格式化您的代码,从而简化维护一致代码库的过程。无论团队内的个人偏好如何,Prettier 都会确保每个人的代码格式都是统一的。

https://img-blog.csdnimg.cn/direct/aeee3134d46847f58101de8bbd7ddd13.png

4Auto Close Tag(自动闭合标签)

Auto Close Tag 插件可以自动闭合 HTMLXML 和其他类似标记语言的标签。当你输入一个开始标签时,它会自动插入相应的结束标签,并将光标定位在两个标签之间,方便你继续编写内容。

https://img-blog.csdnimg.cn/direct/8cdc5d07dc8e4b688957dd67754f6040.png

5open in browser(打开文件)

Open in Browser 插件允许你在编辑器中的 HTMLCSSJavaScript 等文件上右键点击,并通过默认浏览器打开这些文件。你可以在 VS Code 中打开一个 HTML 文件,并在编辑器中右键点击该文件。在右键菜单中,你会看到一个 Open in Default Browser 的选项。选择该选项后,插件会自动使用你的默认浏览器打开该HTML文件,并在浏览器中显示其内容。

https://img-blog.csdnimg.cn/direct/f78865fd390640b8b47fe2030d86f276.png

6Eslint(错误标注)

Eslint插件可以发现代码中的错误和错误,从而使编码变得更好。它通过显示可能出现错误或警告的位置来帮助您避免错误。另外,它甚至可以自动修复这些问题。

https://img-blog.csdnimg.cn/direct/42ab59a53a294d2faa710effe039efff.png

7Path Intellisense(路径补全)

Path Intellisense 插件提供了路径智能感知的功能,帮助你更轻松地输入和补全文件路径。当你在编辑器中输入文件路径时,它会自动为你提供路径的建议和补全。

https://img-blog.csdnimg.cn/direct/2d562a41a3014fa3bb2725d639b9bb9d.png

8GitLens(浏览 git 相关信息)

GitLens 插件可以为你的 Git 体验增添许多强大的功能。通过 GitLens 插件,你可以在编辑器中直接查看和浏览 Git 版本控制的相关信息。

安装该插件后,vscode会出现源代码管理模块,使用很方便。

https://img-blog.csdnimg.cn/direct/c73c9298e0774d5fa8ed23ad1f686ad4.png

9Git History

该插件用于查看 Git 日志和文件历史记录并比较分支或提交。

10CSS Peek

该插件帮助我们从 HTML JavaScript 文件快速导航和编辑外部样式表中定义的 CSS 样式。它提供了一个“Peek”功能,在 HTML 中选择某个 class 或者 id 名称按住Ctrl+鼠标左键可以直接定位到该名称的CSS的位置。

该插件适用于处理大型或复杂的 CSS 样式表,因为它可以快速查找和编辑应用于特定元素的样式,而无需浏览多个文件或搜索大量代码。

 安装了prettier插件的话,项目中的 .editorconfig文件中配置项是生效的。该文件用来定义项目的编码规范,编辑器的行为会与.editorconfig 文件中定义的一致,并且其优先级比编辑器自身的设置要高

  1. root = true
  2. # 对所有文件生效
  3. [*]
  4. # utf-8编码
  5. charset = utf-8
  6. # 空格形式缩进2空格
  7. indent_style = space
  8. indent_size = 2
  9. # 使用单引号
  10. quote_type = single
  11. # Linux换行符
  12. end_of_line = lf
  13. # 结尾插入新行
  14. insert_final_newline = true
  15. # 去除结尾空格
  16. trim_trailing_whitespace = true

vscode,user settting中添加以下配置,可以实现保存时自动使用prettier格式化代码。

  1. // 保存时 prettier 自动格式化
  2. "editor.formatOnSave": true,

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Monodyee/article/detail/644364
推荐阅读
相关标签
  

闽ICP备14008679号