vscode好用的插件

图标工具 vscode-icons

介绍：

VsCode中的图标插件，可以控制vscode中的文件管理的树目录显示图标

screenshot.gif

官网地址：https://marketplace.visualstudio.com/items?itemName=robertohuertasm.vscode-icons

使用方法：

1.快捷键 Ctrl+P ，输入 ext install vscode-icons ，然后点击安装插件

2. 右侧插件商店 搜索 vscode-icons 进行安装

配置

安装成功后，点击Reload重新加载。
然后配置，当前图标使用VsCode-Icons
Go to File > Preferences > File Icon Theme > VSCode Icons.

相关扩展

• vscode-图标的GitHub通过@dderevjanik将让你看到所有GitHub带的文件vscode-icons图标。
• vscode-图标，JS通过@dderevjanik得到文件/文件夹特定的图标vscode-icons图标。

代码高亮工具 Beautify

描述：

美化css，sass和更少的代码（Visual Studio代码的扩展）
命令“beautify.format”
如果您美化其他语言，代码/文本将被美化为Visual Studio Code的默认格式化程序。
官网地址：[https://marketplace.visualstudio.com/items?itemName=michelemelluso.code-beautifier#overview)

选项：

beautify.tabSize（缩进代码的制表符大小）
beautify.options（Beautifier选项：https：//github.com/beautify-web/js-beautify#css--html）

自动重命名标签- Auto rename tag

介绍：

自动重命名配对的HTML / XML标记，与Visual Studio IDE一样。
重命名一个HTML / XML标记时，会自动重命名配对的HTML / XML标记

usage.gif

官网地址：[https://github.com/formulahendry/vscode-auto-rename-tag)

配置：

添加条目auto-rename-tag.activationOnLanguage以设置将激活扩展的语言。默认情况下，它将["*"]被激活并将被激活所有语言。

{
     “ auto-rename-tag.activationOnLanguage ”：[
         “ html ”，
         “ xml ”，
         “ php ”，
         “ javascript ”
    ]
}

注意：

应使用VS Code中定义的语言ID设置该设置。以javascript定义为例，我们需要使用javascriptfor .js和.es6use javascriptreactfor .jsx。因此，如果要在.js文件中启用此扩展，则需要添加javascriptsettings.json。

代码对齐辅助线 -Guides

辅助线如何与内置缩进辅助线不同？

• 缩进背景
• 颜色和样式自定义
• 隐藏选择

自定义

• 请查看首选项以查看所有可用选项。可以通过自动完成对话框访问可能的值。以下选项可能会影响指南的执行方式......

• guides.indent.backgrounds：
  此设置可能会导致多个缩进的性能降低。每种颜色都将用于每个缩进级别，并将循环自身。值必须采用rgba(red, green, blue, alpha)格式

• guides.limit.maximum：
  设置-1为无限制的最大渲染边界。
  设置为浮点数0，1将基于文档大小的限制。例如，0.5当前文档中的渲染指南最多可覆盖50％。
  设置为1或更多以呈现指定行数的最大值。

• guides.overrideDefault：
  设置为“true”以禁止对默认Visual Studio代码行为的任何建议。

主题 OneDark