1.HTML Boilerplate

  通过使用 HTML 模版插件,你就摆脱了为 HTML 新文件重新编写头部
和正文标签的苦恼。你只需在空文件中输入 html,并按 Tab 键,即可
生成干净的文档结构。

html

2.Color Picker

  在书写 HTML 和 CSS 的时候,你可能经常需要修改元素的颜色。
VS Code 为修改颜色,提供了一个图形化的界面,其中包含了颜色  
相关的属性。
  当你打开一段 HTML 或者 CSS 代码时,你可以看到,VS Code 在颜色 
的前面画了一个方块(即颜色装饰器 Color Decorator),用于展示这段
颜色属性所对应的最终效果。然后你把鼠标移动到这段代码上时,一个
颜色选择器窗口就显示出来了,根据

调整颜色

3.CSS Peek

  使用此插件,你可以追踪至样式表中 CSS 类和 ids 定义的地方。当你
在 HTML 文件中右键单击选择器时,选择“ Go to Definition 和 Peek 
definition ”选项,它便会给你发送样式设置的 CSS 代码。

CSS Peek

4.Path lntellisense

  自动路径补全

自动路径补全

5.IntelliSense for CSS class names in HTML

  CSS类名自动感应

css类目自动感应

6.Beautify

	美化javascript,JSON,CSS,Sass,和HTML在Visual Studio
代码。

美化代码

7.Auto Rename Tag

  无论你选择哪种框架,假如当开始和结束标签间的代码有 50 多行时,
你想将一个H2标签更改为H3标签,或者你想将一个div标签更改为span
标签,不管要做什么,你都要浪费时间来查找结束标签,这时候就该用
这个插件-- Auto Rename Tag

自动修改闭合标签

8.Debugger for Chrome

Debugger for Chrome 这款插件就可以做到这点,它由微软发布,允许
你在 VSCode 中直接调试网页源文件,该插件主要利用 Chrome 所开
放出来的接口来实现对其渲染的页面进行调试。

在这里插入图片描述

9.vscode-icon

让vacode资源树目录加上图标,必备良品

资源树图标

10.Highlight Matching Tag

实时高亮匹配标签,不用在 HTML 中眼花缭乱的找标签了

标签高亮

11.Bracket Pair Colorizer

此扩展名允许匹配的括号用颜色标识。用户可以定义要匹配的字符以及
要使用的颜色

在这里插入图片描述

12.Visual Studio Intellicode

帮助开发人员生成智能代码补全提示

代码补全

13.Vetur

Vetur是一款必备的Vue开发工具。支持多种功能,比如语法高亮、错误
检测、Emmet和Snippet等等

在这里插入图片描述

14.open in browser

在这里插入图片描述

如还有好用的插件没有说到 请各位大神在评论区留言 我会及时补充 共同的来完善它

Logo

技术共进,成长同行——讯飞AI开发者社区

更多推荐