0

0

【吐血总结】VSCode最全实用插件,助你提升开发效率!

青灯夜游

青灯夜游

发布时间:2022-05-16 20:55:42

|

9288人浏览过

|

来源于csdn

转载

本篇文章给大家分类汇总了一些vscode实用插件,可以帮助开发者提高开发效率、美观性等等,希望对大家有所帮助!

【吐血总结】VSCode最全实用插件,助你提升开发效率!

【推荐学习:《vscode入门教程》】

一、必备插件

Chinese(中文)

安装后,按快捷键Ctrl+Shift+P,输入

configure language

Settings Sync(配置同步到云端)

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

wakatime(编程时间及行为跟踪统计)

 编程时间及行为跟踪统计

二、效率神器

HTML Snippets(代码提示)

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

Auto Close Tag(自动闭合标签)

自动闭合HTML/XML标签

Bracket Pair Colorizer(括号做颜色区分)

括号做颜色区分

"workbench.colorCustomizations": {"editorIndentGuide.activeBackground": "#00ffea"}

Browser Preview(VSCode里面打开浏览器)

可以在vscode里面打开浏览器,一边编码一边查看

REST Client(接口调试)

可以在vscode里面进行接口调试,提供丰富的api配置方式,让我们不用离开编辑器也可以随时调用接口调试

新建一个.http文件,写下基本的测试代码,点击 Send Request即可在右边窗口查看接口返回结果,非常nice

CSS Peek(css样式查看器)

Partial Diff(文件比较)

文件比较

Npm Intellisense(自动完成导入语句中的npm模块)

可自动完成导入语句中的npm模块

open in browser(快速打开html文件到浏览器预览)

快速打开html文件到浏览器预览

Path Intellisense(快速引入文件)

自动提示文件路径,支持各种快速引入文件

Image preview(预览图片)

鼠标悬浮在链接上可及时预览图片

三、Git集成

GitHub Pull requests( 查看和管理GitHub拉取请求和问题)

在Visual Studio Code中查看和管理GitHub拉取请求和问题

Git Graph(Git 图形化显示和操作)

谱乐AI
谱乐AI

谱乐AI,集成 Suno、Udio 等顶尖AI音乐模型的一站式AI音乐生成平台。

下载

GitLens(快速查看更改行或代码块的对象)

GitLens可以帮助您更好地理解代码。快速查看更改行或代码块的对象

GitHistory(可查看和搜索git日志以及图形和详细信息)

GitHistory可查看和搜索git日志以及图形和详细信息,同时还支持分支比较,分支管理等操作

四、美化

(黑白两款皮肤)

vscode-icons(漂亮的目录树图标主题)

提供了非常漂亮的目录树图标主题

Beautify(右键鼠标一键格式化)

在代码文件右键鼠标一键格式化 html,js,css

Vetur(官方钦定Vue插件)

VScode官方钦定Vue插件,Vue开发者必备。内含语法高亮,智能提示,emmet,错误提示,格式化,自动补全,debugger等实用功能

代码风格规范类插件

Better Align(代码优雅排版)

代码优雅排版

选中代码配合组合键[Ctrl+Shift+p],输入Align即可

Better Comments(丰富注释颜色)

丰富注释颜色

自定义样式,需要写入配置代码

配置代码
"better-comments.tags": [ {"tag": "*","color": "#98C379","strikethrough": false,"backgroundColor": "transparent" }]
使用// * 绿色的高亮注释复制代码TODO Tree

五、代码规范

change-case(变量命名规范)

变量命名规范

JavaScript Booster(代码改进)

会提示对应的不合理原因和改进方案

JavaScript (ES6) code snippets(智能提示与快速输入)

ES6语法智能提示,以及快速输入

ESlint(严谨的规范书写)

规范js代码书写规则,如果觉得太过严谨,可自定义规则

TSLint(书写规范)

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

Code Spell Checker(拼写检查程序)

是拼写检查程序,检查不常见的单词,如果单词拼写错误,会给出警告提示

koroFileHeader(生成文件头部注释和函数注释)

在vscode中用于生成文件头部注释和函数注释的插件,经过多版迭代后,插件:支持所有主流语言,功能强大,灵活方便,文档齐全,食用简单!

不光如此,还能生成一些特别有意思的注释,比如这一条喷火龙...

六、装X神器

Markdown All in One(书写Markdown)

可以在vscode里面快乐的书写Markdown,功能强大。丰富的快捷键,边写边看,轻松转化为html或pdf文件

vscode-drawio(画流程图)

可以在vscode里面快乐的画流程图,新建 .drawio 后缀文件并拖入vscode中

Polacode-2020(转化成一张逼格满满的图片)

可以将我们的代码转化成一张逼格满满的图片

Live Share(与他人实时进行协作式编辑和调试)

这款神器可以使您能够与他人实时进行协作式编辑和调试

更多关于VSCode的相关知识,请访问:vscode教程

相关专题

更多
Java 桌面应用开发(JavaFX 实战)
Java 桌面应用开发(JavaFX 实战)

本专题系统讲解 Java 在桌面应用开发领域的实战应用,重点围绕 JavaFX 框架,涵盖界面布局、控件使用、事件处理、FXML、样式美化(CSS)、多线程与UI响应优化,以及桌面应用的打包与发布。通过完整示例项目,帮助学习者掌握 使用 Java 构建现代化、跨平台桌面应用程序的核心能力。

37

2026.01.14

php与html混编教程大全
php与html混编教程大全

本专题整合了php和html混编相关教程,阅读专题下面的文章了解更多详细内容。

19

2026.01.13

PHP 高性能
PHP 高性能

本专题整合了PHP高性能相关教程大全,阅读专题下面的文章了解更多详细内容。

37

2026.01.13

MySQL数据库报错常见问题及解决方法大全
MySQL数据库报错常见问题及解决方法大全

本专题整合了MySQL数据库报错常见问题及解决方法,阅读专题下面的文章了解更多详细内容。

19

2026.01.13

PHP 文件上传
PHP 文件上传

本专题整合了PHP实现文件上传相关教程,阅读专题下面的文章了解更多详细内容。

16

2026.01.13

PHP缓存策略教程大全
PHP缓存策略教程大全

本专题整合了PHP缓存相关教程,阅读专题下面的文章了解更多详细内容。

6

2026.01.13

jQuery 正则表达式相关教程
jQuery 正则表达式相关教程

本专题整合了jQuery正则表达式相关教程大全,阅读专题下面的文章了解更多详细内容。

3

2026.01.13

交互式图表和动态图表教程汇总
交互式图表和动态图表教程汇总

本专题整合了交互式图表和动态图表的相关内容,阅读专题下面的文章了解更多详细内容。

45

2026.01.13

nginx配置文件详细教程
nginx配置文件详细教程

本专题整合了nginx配置文件相关教程详细汇总,阅读专题下面的文章了解更多详细内容。

9

2026.01.13

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
go语言零基础开发内容管理系统
go语言零基础开发内容管理系统

共34课时 | 2.5万人学习

第二十三期_前端开发
第二十三期_前端开发

共98课时 | 7.4万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号