插件下载
基础
Auto Close Tag:自动闭合HTML标签
ESLint:代码规范检查与实时纠错
Prettier:代码格式化工具,支持多语言
GitLens:增强Git功能,显示代码历史记录
Path Intellisense:路径智能提示
Error Lens:实时高亮代码错误
GitHub Copilot:AI代码补全与建议
调试预览
Live Server:实时刷新HTML页面
Browser Preview:内置浏览器预览
Image Preview:图片路径悬浮预览
外观
Indenticator:直观的代码缩进深度
CSS
CSS Peek:主要作用是帮助开发人员更轻松地查找和导航CSS样式表中的类、ID、选择器和样式定义。
操作:当您在HTML文件中按住Ctrl键并将鼠标悬停在某个类或ID上时,会显示一个查看窗口,其中包含了应用于该元素的CSS样式。此外,您还可以通过单击查看窗口或在类或ID的名称上按F12键来跳转到CSS代码的定义位置。
CSS Initital Value:显示每个 CSS 属性初始值
JS
JavaScript (ES6) code snippets:它为 JavaScript、TypeScript、HTML、React 和 Vue 提供了 ES6 的语法支持。
JavaScript (ES6) Code Snippets 包含了大量的预定义代码片段,旨在简化 JavaScript ES6 语法的使用,并且还支持 TypeScript、JSX 和无分号代码。这些代码片段可以帮助开发者在使用 JavaScript 进行开发时,快速插入常用的代码模板,从而提高编码效率。
框架相关
VUE
Vue 3 Snippets:Vue 3代码片段
VueHelper:Vue 2组件跳转与API提示
React
ES7 React/Redux Snippets:React代码片段
React Style Helper:内联样式辅助工具
效率
Path Intellisense:自动完成文件名的 Visual Studio Code 插件
Import Cost:此扩展将在编辑器中内联显示导入包的大小。该扩展使用 webpack 来检测导入的大小。
any-rule:这下在使用正则判断表单内容时就不用每次都到处去百度了。