精选前端VS Code高频插件
1.HTML Boilerplate通过使用 HTML 模版插件,你就摆脱了为 HTML 新文件重新编写头部和正文标签的苦恼。你只需在空文件中输入 html,并按 Tab 键,即可生成干净的文档结构。2.Color Picker在书写 HTML 和 CSS 的时候,你可能经常需要修改元素的颜色。VS Code 为修改颜色,提供了一个图形化的界面,其中包含了颜色相关的属性。当你打开一段 HTML 或
·
1.HTML Boilerplate
通过使用 HTML 模版插件,你就摆脱了为 HTML 新文件重新编写头部
和正文标签的苦恼。你只需在空文件中输入 html,并按 Tab 键,即可
生成干净的文档结构。
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 代码。
4.Path lntellisense
自动路径补全
5.IntelliSense for CSS class names in HTML
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
如还有好用的插件没有说到 请各位大神在评论区留言 我会及时补充 共同的来完善它
更多推荐
所有评论(0)