VSCode 是我们前端开发的一个强壮的IDE，所以挑选趁手好用的插件是进步开发功率，然后剩下的时刻用来摸鱼是很有必要滴。

Indenticator

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

Indenticator :直观地突出显现当时的缩进深度。此扩展可以单独运用，但建议与内置缩进指南一同运用（设置editor.renderIndentGuides）。这些在每个缩进上显现细灰线，而此扩展突出显现光标当时所在缩进深度上的缩进。

  • 插件名：Indenticator
  • 官方地址： https://marketplace.visualstudio.com/items?itemName=SirTori.indenticator

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

Guides

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

Guides : Guides 只是添加各种缩进指南线的插件。

  • 插件名：Guides
  • 官方地址： https://marketplace.visualstudio.com/items?itemName=spywhere.guides

Auto Import – ES6、TS、JSX、TSX

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

Auto Import : 自动导入 – ES6、TS、JSX、TSX（VSCode 扩展）。

  • 插件名：Auto Import – ES6、TS、JSX、TSX
  • 官方地址： marketplace.visualstudio.com/items?itemN…

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

JavaScript (ES6) code snippets

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

JavaScript (ES6) code snippets: 此扩展包含用于 Vs Code编辑器的 ES6 语法中的 JavaScript 代码片段（一起支撑 JavaScript 和 TypeScript。

  • 插件名：JavaScript (ES6) code snippets
  • 官方地址： marketplace.visualstudio.com/items?itemN…

Paste JSON as Code

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

Paste JSON as Code:从 JSON、JSON Schema 和 TypeScript 交互式生成类型和（反）序列化代码；将 JSON/JSON Schema/TypeScript 张贴为代码。

  • 插件名：Paste JSON as Code
  • 官方地址： https://marketplace.visualstudio.com/items?itemName=quicktype.quicktype

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

JSON to TS

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

JSON to TS: 将 JSON 对象转化为 TypeScript 接口。

  • 插件名：JSON to TS
  • 官方地址： https://marketplace.visualstudio.com/items?itemName=MariusAlchimavicius.json-to-ts
  • 特征：
    • 从剪贴板转化（Shift + Ctrl + Alt + V）
      • VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）
    • 从挑选转化（Shift + Ctrl + Alt + S）
      • VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）
    • 可选引号
      • VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）
    • 转化器
      • 数组类型兼并（大交易）
      • 重复类型预防
      • 联合类型
      • 可选类型
      • 数组类型

\

Regex Previewer

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

Regex Previewer:。

  • 插件名：Regex Previewer
  • 官方地址： https://marketplace.visualstudio.com/items?itemName=chrmarti.regex
  • 特征： 在并排文档中显现当时正则表达式的匹配项。Ctrl+Alt+M这可以用( )打开/封闭⌥⌘M。可以经过状态栏条目添加大局和多行选项以运用并排文档进行评估。当并排文档有多个要匹配的示例时，这或许很有用。

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

\

Sort Typescript Imports

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

Regex Previewer:对 Typescript 代码中的导入句子进行排序。

  • 插件名：Sort Typescript Import
  • 官方地址： https://marketplace.visualstudio.com/items?itemName=miclo.sort-typescript-imports
  • 特征： **此可配置扩展答应您对 .ts 或 .tsx 文件中的所有导入进行排序

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

\

Turbo Console Log

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

Turbo Console Log:此扩展经过自动化编写有意义的日志音讯的操作使调试变得更加容易。

  • 插件名：Turbo Console Log
  • 官方地址： https://marketplace.visualstudio.com/items?itemName=ChakrounAnas.turbo-console-log

\

Dot Log

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

Dot Log:一个运用 .log将参数记录到控制台的 vscode 扩展。

  • 插件名：Dot Log
  • 官方地址： https://marketplace.visualstudio.com/items?itemName=jaluik.dot-log

VSCode中值得推荐的常用的33个高效前端插件「效率篇」（三）

后续如有发现更多更好的插件将继续分享。装置太多的插件恐会影响 VSCode 的发动速度，一起添加内存的占用，或许影响开发功率，最终适得其反，所以建议只装置自己喜爱的、常用的即可。