High productivity tools: web front-end development VScode necessary plug-Daquan (For their good work must first sharpen his tools)

Bracket Pair Colorizer

Friendly to the brackets of different colors, easy to distinguish between different blocks, the user can also define brackets type and color, especially Dart language development, is particularly important.
Here Insert Picture Description

Terminal

Editor embedded in a run command terminal like the terminal program cmd directly in the editor.
Here Insert Picture Description

Path Intellisense

Plug-Automatic prompting for file path, supports a variety of file no brain fast introduction, very convenient.
Here Insert Picture Description

JavaScript(ES6) code snippets

ES6 grammar intelligent input prompt and fast, not only support .js, supports .ts, .jsx, .tsx, .html, .vue.
Here Insert Picture Description

ES7 React/Redux/GraphQL/React-Native snippets

React / Redux / Reatc Native / react-router grammar smart tips, React developers must have.
Here Insert Picture Description

winter

Vue multi-functional integrated plug-ins, including: syntax highlighting, smart tips, emmet, error messages, formatting, auto-completion, debugger. vscode official Imperial Vue plug-in, Vue developer necessary.
Here Insert Picture Description

Npm Intellisense

After npm-pack packages require intelligent when prompted, Import statement autocomplete npm module.
Here Insert Picture Description

Markdown Preview Enhanced

Live Preview Markdown, Markdown (.MD) users must have.
Here Insert Picture Description

code spell checker

Check your spelling of English words, if the word does not exist in the library will be at the lower wavy line.
Here Insert Picture Description

Better Comments

Some of the comments of the highlights, the team very well and focused tips. There are symbols: *,, TODO, @ param!.
Here Insert Picture Description

markdownlint

Markdown syntax error correction, quick start MD syntax.
Here Insert Picture Description

Auto Close Tag

Automatic closing HTML / XML tags, very fast write HTML code.
Here Insert Picture Description

Auto Rename Tag

Automatically synchronize modified HTML / the other side of the tag XML, is very convenient.
Here Insert Picture Description

ESLint

JavaScript 语法纠错,可以自定义配置,也可以参照官网的配置,摆正开发者的代码格书写格式。
Here Insert Picture Description

GitLens

快捷方便查看 Git 日志,高频使用 Git 者必备,这里有配置教程
Here Insert Picture Description

HTML CSS Support

智能提示 CSS 类名以及 id 名,非常高效。
Here Insert Picture Description

HTML Snippets

智能提示 HTML 标签,以及标签的含义,再也不用翻手册了。
Here Insert Picture Description

jQuery Code Snippets

jQuery 代码智能提示,非常优雅。
Here Insert Picture Description

vscode-icons

美化插件,用于美化目录树图标主题。
Here Insert Picture Description

Dracula Official

编辑器颜色主题,很漂亮。
Here Insert Picture Description

Class autocomplete for HTML

智能提示HTML class =“”属性,很好用。
Here Insert Picture Description

IntelliSense for CSS class names

智能提示 css 的 class 名,无脑录入。
Here Insert Picture Description

vsc-netease-music

写代码无聊,来点音乐?好的!
Here Insert Picture Description

Power Mode

打字炫酷特效震动光效插件,这是配置教程,可以装着玩玩。
Here Insert Picture Description

live Server

模拟本地服务器,编写网页时保存后自动刷新,无需到浏览器中刷新。
Here Insert Picture Description

Visual Studio IntelliCode

给开发者提供最合适的 IntelliSense 上下文建议功能,除此之外,还有代码格式化和规则推测等功能。
Here Insert Picture Description

Image Preview

鼠标悬浮在链接或者装订线(gutter)左边可以预览到图片,非常方便。
Here Insert Picture Description

Output Colorizer

输出提示的文字颜色有一些变化,方便获取关键信息。
Here Insert Picture Description

filesize

在底部状态栏显示当前文件大小,点击后还可以看到详细创建、修改时间。
Here Insert Picture Description

SVG Viewer

无需离开编辑器,便可以打开 SVG 文件并查看。
Here Insert Picture Description

WakaTime

如果你想记录每天编程所花的时间,它可以帮助记录和存储有关编程活动的指标和分析。
Here Insert Picture Description

Color Info

Provide information about your use of color in CSS, hover the cursor, you can preview the color in the color model (HEX, RGB, HSL and CMYK).
Here Insert Picture Description

Minify

The combined application used to compress JavaScript and CSS files, command generates .min files.
Here Insert Picture Description

Published 237 original articles · won praise 338 · views 760 000 +

Guess you like

Origin blog.csdn.net/weixin_44198965/article/details/103747866