高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)

Bracket Pair Colorizer

友好的给括号加上不同的颜色,便于区分不同的区块,使用者还可以定义括号类型和颜色,尤其是 Dart 语言开发,尤为重要。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第1张图片

Terminal

编辑器中内嵌一个似 cmd 终端程序,直接在编辑器中运行终端命令。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第2张图片

Path Intellisense

插件自动提示文件路径,支持各种文件无脑快速引入,非常方便。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第3张图片

JavaScript(ES6) code snippets

ES6 语法智能提示及快速输入,不仅仅支持 .js,还支持.ts,.jsx,.tsx,.html,.vue。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第4张图片

ES7 React/Redux/GraphQL/React-Native snippets

React/Redux/Reatc Native/react-router 语法智能提示,React 开发者必备。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第5张图片

Vetur

Vue 多功能集成插件,包括:语法高亮,智能提示,emmet,错误提示,格式化,自动补全,debugger。vscode 官方钦定 Vue 插件,Vue开发者必备。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第6张图片

Npm Intellisense

npm 装包后,require 时的包智能提示,import 语句中自动填充 npm 模块。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第7张图片

Markdown Preview Enhanced

实时预览 Markdown,Markdown(.MD) 使用者必备。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第8张图片

code spell checker

检查你的英文单词拼写是否有误,如果有库里不存在的单词则会下下波浪线。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第9张图片

Better Comments

使注释有人性化的高亮显示,团队中非常适用,突出重点提示。 符号有:* 、! 、TODO 、@param。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第10张图片

markdownlint

Markdown 语法纠错,快速上手 MD 语法。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第11张图片

Auto Close Tag

自动闭合 HTML / XML 标签,非常快速的编写 HTML 代码。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第12张图片

Auto Rename Tag

自动完成 HTML / XML 另一侧标签的同步修改,非常方便。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第13张图片

ESLint

JavaScript 语法纠错,可以自定义配置,也可以参照官网的配置,摆正开发者的代码格书写格式。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第14张图片

GitLens

快捷方便查看 Git 日志,高频使用 Git 者必备,这里有配置教程。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第15张图片

HTML CSS Support

智能提示 CSS 类名以及 id 名,非常高效。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第16张图片

HTML Snippets

智能提示 HTML 标签,以及标签的含义,再也不用翻手册了。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第17张图片

jQuery Code Snippets

jQuery 代码智能提示,非常优雅。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第18张图片

vscode-icons

美化插件,用于美化目录树图标主题。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第19张图片

Dracula Official

编辑器颜色主题,很漂亮。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第20张图片

Class autocomplete for HTML

智能提示HTML class =“”属性,很好用。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第21张图片

IntelliSense for CSS class names

智能提示 css 的 class 名,无脑录入。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第22张图片

vsc-netease-music

写代码无聊,来点音乐?好的!
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第23张图片

Power Mode

打字炫酷特效震动光效插件,这是配置教程,可以装着玩玩。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第24张图片

live Server

模拟本地服务器,编写网页时保存后自动刷新,无需到浏览器中刷新。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第25张图片

Visual Studio IntelliCode

给开发者提供最合适的 IntelliSense 上下文建议功能,除此之外,还有代码格式化和规则推测等功能。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第26张图片

Image Preview

鼠标悬浮在链接或者装订线(gutter)左边可以预览到图片,非常方便。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第27张图片

Output Colorizer

输出提示的文字颜色有一些变化,方便获取关键信息。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第28张图片

filesize

在底部状态栏显示当前文件大小,点击后还可以看到详细创建、修改时间。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第29张图片

SVG Viewer

无需离开编辑器,便可以打开 SVG 文件并查看。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第30张图片

WakaTime

如果你想记录每天编程所花的时间,它可以帮助记录和存储有关编程活动的指标和分析。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第31张图片

Color Info

提供你在 CSS 中使用颜色的相关信息,悬停光标,就可以预览色块中色彩模型的(HEX、 RGB、HSL 和 CMYK)。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第32张图片

Minify

用于压缩合并 JavaScript 和 CSS 文件的应用程序,命令生成 .min 文件。
高效率工具:web前端开发VScode必备插件大全(欲其善其事必先利其器)_第33张图片

你可能感兴趣的:(+,VScode)