vscode中好用的插件_捷达VS5和捷途X95哪个好

Auto Rename Tag

自动重命名配对的HTML / XML标签

Auto Close Tag

自动添加HTML / XML结束标签

any rule

常用正则表达式合集和工具

Browser Preview

编辑器中嵌入浏览器可视化窗口

Bracket Pair Colorizer

高亮匹配代码块括号

Better Comments

文档注释 /** * 我的方法 * *重要的信息会被高亮显示 * !及其反对的代码,不要使用 * TODO 重构此方法 * @param 该方法的参数 */

Better Align

根据符号（如冒号、等于号）对齐多行代码 使用方法：Ctrl Shift p输入“Align”确认即可

Code Runner

非常强大的一款插件，能够运行多种语言的代码片段或代码文件：C，C ，Java，JavaScript，PHP，Python，Perl，Ruby，Go等等，安装完成后，右上角会出现：▶解决输出乱码和支持输入问题：选择 文件->首选项->设置，打开VS Code设置 > Extensions，找到 Run Code configuration，勾上 Run In Terminal选项。设置之后代码就会在 Terminal 中运行了，无乱码及支持输入。

change-case

修改文本的更多命名格式，包括驼峰命名、下划线分隔命名，snake_case 命名以及 CONST_CAS 命名等 使用方法：Ctrl Shift p输入“change”然后选择要修改的格式

Color Info

颜色上悬停光标，就可以预览色块中色彩模型的（HEX、 RGB、HSL 和 CMYK）相关信息

Color Highlight

在编辑器中高亮显示颜色值

Color Picker

代码的颜色选择器

Csscomb

css 、less、sass 的代码格式化。

CSS Peek

快速定位元素设置CSS文件及位置 在 HTML 文件中右键单击选择器时，选择“ Go to Definition 和 Peek definition ”选项，它便会给你发送样式设置的 CSS 代码

Class autocomplete for HTML

自动补全class=“” 属性

Codelf

给变量起名的神器

css-auto-prefix

给css加不同浏览器前缀

Debugger for Chrome

js调试的插件，前端项目在Chrome中运行起来之后，可以直接在VSCode中打断点、查看输出、查看控制台

Document This

为js文件生成文档的代码注释。

Draw.io Integration

画流程图

Data Preview

预览数据文件

ESLint

检查Javascript编程时的语法错误

EditorConfig for VS Code

代码风格统一

filesize

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

Format Files

在侧栏文件夹右键，选择‘Start Format Files：This Folder’ 对文件夹所有的文件格式化

Git blame

编辑器左下角展示最近一次的编辑信息

Git History

以图表的形式查看 git 日志

GitLens

查看每一行代码的提交日志

Guides

代码的标签对齐线。

Highlight Matching Tag

选中标签高亮标签对

HTML CSS Class Completion

为基于工作空间上的CSS文件的HTML类属性提供CSS类名称提示。

HTML Boilerplate

提供生成标准HTML样板代码。

HTML CSS support

css 自动补齐

HTMLHint

HTML 代码格式检测

HTML Snippets

支持HTML5标签提示

htmltagwrap

在选中HTML标签后按快捷键”Alt W” 在外面套一层标签

Image Preview

鼠标移到路径里显示图像预览

Indenticator

突出目前的代码缩进深度

Indent-Rainbow

给缩进添颜色，更加直观的看到代码层次

intelliSense for CSS class names in HTML

把项目中 css 文件里的名称智能提示在 html 中

Import Cost

您查看导入模块的大小

JavaScript (ES6) snippets

支持JavaScript ES6 语法

JavaScript (ES6) code snippets

ES6语法提示

jQuery Code Snippets

jq代码段提示。

JS-CSS-HTML Formatter

代码格式化。

koroFileHeader

自动生成文档注释

Live Server

实时简易服务器

Lodash

lodash 函数提示，输入下划线列出可用函数。

Lodash Snippets

lodash 函数提示，输入函数名列表默认第一个是lodash的函数。

Lorem ipsum

快速填充文本

Log File Highlighter

日志文件(.log后缀的文件)高亮

LeetCode

刷算法题的插件

local history

查看本地历史代码

markdownlint

markdown语法检测

Markdown Preview Enhanced

编辑器内看markdown编译出来的效果

Markdown All in One

markdown编辑器

Material Icon Theme

文件目录图标美化

MongoDB for VS Code

MongoDB 数据库支持

npm Intellisense

在import语句中自动完成npm模块引入的代码插件。

Node.js Modules Intellisense

可以在导入语句中自动完成JavaScript / TypeScript模块

Output Colorizer

输出提示的文字颜色有一些变化，方便获取关键信息

open in browser

在浏览器中打开，安装后在左侧目录中右键点击会出现 open in browser 选项。

Path Intellisense

文件路径提示。

Prettier – Code formatter

代码保存自动格式化

Partial Diff

文件比较

Quokka.js

Quokka 是一个调试工具插件，能够根据你正在编写的代码提供实时反馈 使用方法: ctrl shift p 输入 quokka 选择 new javascript 就可以了

Polacode

生成代码截图工具 打开文件在屏幕截图中选择想要的代码并复制它，转到 View> Command Palette，然后在框中输入> polacode 并选择 Polacode 选项。 它将创建一个单独的水平窗口。 点击窗口按 Ctrl V 粘贴代码。 在代码下面，粘贴另一个窗口，会看到像图标这样的摄像头。 点击这个图标并保存图片。

px to rem

px转换rem工具

REST Client

接口测试工具

Regex Previewer

这是一个用于实时测试正则表达式的实用工具。它可以将正则表达式模式应用在任何打开的文件上，并高亮所有的匹配项。快捷键Ctrl Alt M呼出右边的并排文本框，左边窗口输入的正则会实时匹配右边文本内容

Remote – SSH

连接服务器管理文件

Settings Sync

多设备同步Vue插件

Stylelint

CSS/SCSS/Less语法检测

Sort Lines

选中多行文字排序

SVG Viewer

此插件在 Visual Studio 代码中添加了许多实用的 SVG 程序，你无需离开编辑器，便可以打开 SVG 文件并查看它们。同时，它还包含了用于转换为 PNG 格式和生成数据 URI 模式的选项。在svg文件上右键菜单选择”SVG Viewer: View SVG”

Surround

在代码块中增加外包裹模板

TODO Highlight

高亮todo注释

TODO Tree

todo树展示，快速定位到todo位置

Toggle Quotes

切换双引号、单引号、反引号

Turbo Console Log

快速添加 console.log 信息，js debug 必备 快捷键 ctrl alt l 选中变量之后，使用这个快捷键生成 console.log

Vetur

Vue 语法高亮显示, 语法错误检查, 代码自动补全

VS Code CSS Comments

css代码注释。

VSCode Google Translate

多语言开发时，切换语言包。

vscode-browser-plus

在编辑器内预览HTML，通过开启端口(10086)监听当前打开项目的根目录，在编辑器内预览网站，省去了频繁切换浏览器、编辑器看页面效果，修改代码后自动刷新页面。

vscode-fileheader

顶部注释模板，可定义作者、时间等信息，并会自动更新最后修改时间 快捷键: Ctrl Alt i

vscode-icons

设置目录列表文件类型图标

vscode-spotify

音乐播放控制器

Window Colors

打开多个窗口时显示不同的颜色

wakatime

编程时间及行为跟踪统计

Reactjs code snippets

代码提示

React-Native/React/Redux snippets for es6/es7

代码提示

Typescript React code snippets

tsx的react组件片段

CSS Modules

对使用了css modules的jsx标签的类名补全和跳转到定义位置