欢迎访问 生活随笔!

生活随笔

当前位置: 首页 >

Vscode——开发常用插件分享

发布时间:2024/1/1 74 豆豆
生活随笔 收集整理的这篇文章主要介绍了 Vscode——开发常用插件分享 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

一、使用vscode插件干什么?

vscode插件是为了更高效的代码开发,为了美观的代码格式。

下面推荐一些好用的插件

1.简体中文语言包

插件名称:Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code
作用:将VSCode操作界面转换为中文,安装完成,重启VScode即可

2.显示文件图标

插件名称:vscode-icons
作用:vscode中的文件管理的树目录显示图标

3.Live Server 开启本地服务器

插件名称:Live Server
作用:开启一个具有实时重新加载功能的小型开发服务器,可以一边编写代码一边保存,即实时刷新预览

4.自动修改标签对名称

插件名称:Auto Rename Tag
作用:修改标签,自动帮你完成头部和尾部闭合标签的同步修改

5.将代码生成一张图片

插件名称:carbon-now-sh
作用:在实际开发中遇到技术问题或者做部分代码片段分享,可以使用该插件将代码生成一张图片
1.在VSCode中,先选中需要生成图片的代码
2.打开命令托盘:Windows:Ctrl + Shift + P,Mac:Cmd + Shift + P
输入Carbon,回车
3.再打开的网页中,复制粘贴即可

6.prettier 格式化代码

插件名称:prettier
作用:格式化美化代码 ,按Ctrl + s 保存会自动格式化

7.自动补全标签

插件名称:Auto Close Tag
作用:自动补全结束标签

8.Beautify 格式化

插件名称:Beautify
作用: 可格式化css,js,less代码

9.Code Spell Checker 拼写检测

插件名称:Code Spell Checker
作用:帮助我们发现代码中拼写错误的单词

10.HTML Snippets

插件名称:HTML Snippets
作用:HTML代码片段,该插件可为你提供html标签的代码提示,不用键入尖括号了

11.Path Intellisense 路径提示

插件名称:Path Intellisense
作用:自动提示文件路径,支持各种快速引入文件

12.Image preview 图片预览

插件名称:Image preview
作用:鼠标悬浮在链接上可及时预览图片

13.JavaScript (ES6) code snippets

插件名称:JavaScript (ES6) code snippets
作用:ES6语法智能提示,以及快速输入

14.TSLint

插件名称:TSLint
作用:ts的书写规范,这个插件是一个系列,同时还提供了TSLint (deprecated),TSLint Vue,TSLint Vue-TSX

15.koroFileHeader

插件名称:koroFileHeader
作用:用于生成文件头部注释和函数注释的插件

16.GitLens

插件名称:GitLens
作用:能显示每一行代码的作者以及提交时间。

17.GitHistory

插件名称:GitHistory
作用:GitHistory可查看和搜索git日志以及图形和详细信息,同时还支持分支比较,分支管理等操作,非常方便

18.Partial Diff 文件比较

插件名称:Partial Diff
作用:将文件进行对比

19.Polacode-2020(类似第五个插件)

插件名称:Polacode-2020
作用:代码转化成图片
1.在VSCode中,先选中需要生成图片的代码
2.打开命令托盘:Windows:Ctrl + Shift + P 输入polacode

20.browser preview 内置浏览器

插件名称:browser preview
作用:可以让我们在vscode里面打开浏览器,一边编码一边查看

21.Settings Sync

插件名称:Settings Sync
作用:可以让我们的vscode配置同步到云端,当我们跟换电脑或者再次安装vscode的时候,只需要登录账号即可同步配置了

22.Vetur

插件名称:Vetur
作用:Vetur是一款Vue代码高亮显示的一款插件

23.Vue 3 Snippets

插件名称:Vue 3 Snippets
作用:这是一款在 Vue 2 或者 Vue 3 开发中提供代码片段,语法高亮和格式化的 VS Code 插件,能极大提高你的开发效率。

24.Rainbow Brackets

插件名称:Rainbow Brackets
作用:不同颜色的括号插件

25.HTML CSS Support

插件名称:HTML CSS Support
作用:在编写样式表的时候,自动补全功能大大缩减了编写时间

26.Highlight Matching Tag

插件名称:Highlight Matching Tag
作用:html标签对齐高亮

27.px to rem & rpx (cssrem)

插件名称:px to rem & rpx (cssrem)
作用:px转rem插件

总结

以上是生活随笔为你收集整理的Vscode——开发常用插件分享的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。