VS Code 之所以成为最受欢迎的编辑器之一，很大程度上得益于其丰富的扩展生态。本人精选 20 个实用or有趣的 VS Code 扩展，覆盖摸鱼放松，文件管理、代码规范、效率工具等等多个场景，干货满满，下面正片开始：
1 看小说漫画：any-reader
- 核心功能： 在 VS Code 中阅读小说、文档，支持 TXT/EPUB 格式、章节导航、字体调整。
- 适用场景：利用碎片时间阅读技术文档或轻小说，避免频繁切换应用。
- 隐藏技巧：支持自定义快捷键翻页，可设置阅读定时提醒。
2 偷偷在状态栏看小说：Thief-Book
- 核心功能：在状态栏显示小说，支持阅读进度。
- 适用场景：利用碎片时间阅读技术文档或轻小说，避免频繁切换应用。
- 隐藏技巧：支持快捷键翻页。
3 看股票基金期货：韭菜盒子
- 核心功能 ：
- 基金实时涨跌，实时数据，支持海外基展示
- 股票实时涨跌，支持 A 股、港股、美股
- 期货实时涨跌，支持国内期货
- 底部状态栏信息
- 开市自动刷新，节假日关闭轮询
- 支持升序/降序排序、基金持仓金额升序/降序
- 基金实时走势图和历史走势图
- 基金排行榜
- 基金持仓信息
- 支持维护持仓成本价，自动计算收益率
- 基金趋势统计图
- 基金支持分组展示等等...
- 注意：投资有风险，入市需谨慎！
4 小霸王
- 核心功能：一款基于vscode的nes游戏插件，主打本地与远程游戏资源管理，让你在编辑器内就能完成游戏的添加、下载、启动全流程。
- 不建议上班玩哈！
5. JSON 变可视化树图：JSON Crack
- 核心功能：将 JSON 数据转换为交互式树状可视化图表，支持折叠/展开节点、搜索内容。
- 适用场景：分析复杂 JSON 结构（如 API 响应、配置文件）、快速定位数据层级。
- 优势：比原生 JSON 格式化更直观，支持大体积 JSON 数据渲染。
6. 改变工作区的颜色来快速识别当前项目：Peacock
- 核心功能：为不同工作区设置独特的颜色主题（标题栏、活动栏颜色），快速区分多个 VS Code 窗口。
- 适用场景：同时打开多个项目时，通过颜色直观识别当前操作的项目（如生产环境项目用红色，测试环境用绿色）。
- 个性化选项：支持按项目自动切换颜色，可自定义颜色饱和度和亮度。
7. 编码时长统计：Time Master
- 核心功能：自动记录代码编写时间、文件修改统计，生成每日/每周编程报告，分析编码效率。
- 适用场景：跟踪项目开发时间、了解自己的编码习惯、评估任务耗时。
- 特色：支持集成到 VS Code 状态栏实时显示当前编码时长，数据本地存储保护隐私。
8. 生成文件夹树结构：file-tree-generator
- 核心功能：一键生成项目文件夹结构并复制为文本，支持自定义忽略文件和格式。
- 适用场景：编写 README 文档、项目说明时快速插入目录结构，或向团队展示项目架构。
- 使用技巧：右键文件夹选择「Generate File Tree」，可通过配置文件自定义输出格式。
9. 轻松切换项目：Project Manager
- 核心功能：快速保存和切换多个项目，支持按标签分类、搜索项目，无需反复通过文件管理器打开文件夹。
- 适用场景：同时开发多个项目时，减少切换成本；整理常用项目集合。
- 特色功能：支持从 Git 仓库、本地文件夹导入项目，可配置项目启动命令。
10. 将文件保存到本地历史记录：Local History
- 核心功能：自动为文件创建本地历史版本，支持对比不同版本差异、恢复误删内容。
- 适用场景：防止代码意外丢失、追踪文件修改记录、找回被覆盖的代码。
- 优势：无需依赖 Git，即使未提交的更改也能保存，历史记录默认保留 90 天。
11. 生成文件头部注释和函数注释：koroFileHeader
- 核心功能：自动生成文件头部注释（作者、日期、描述等）和函数注释，支持自定义注释模板。
- 适用场景：统一团队代码注释规范，快速生成符合 JSDoc、JavaDoc 等标准的注释。
- 高级用法 ：通过配置文件定义不同语言的注释模板，支持快捷键触发（默认
Ctrl+Alt+i生成函数注释）。
12. 复制 JSON 粘贴为代码：Paste JSON as Code
- 核心功能：将 JSON 数据粘贴为指定语言的类型定义或实体类（支持 TypeScript、Go、C#、Python 等 20+ 语言）。
- 适用场景：根据 API 返回的 JSON 结构快速生成接口类型定义，避免手动编写类型。
- 使用技巧 ：复制 JSON 后执行命令「Paste JSON as Code」，选择目标语言和变量名即可生成代码。
13. 把代码块框起来：Blockman - Highlight Nested Code Blocks
- 核心功能：用彩色边框高亮嵌套的代码块（如函数、循环、条件语句），直观区分代码层级。
- 适用场景：阅读复杂代码、调试嵌套逻辑时，快速定位代码块边界。
- 特色：支持自定义边框样式、透明度和颜色，兼容大多数代码主题。
14. SVG 预览和编辑：SVG Preview
- 核心功能：在 VS Code 中实时预览 SVG 图片，支持直接编辑 SVG 代码并即时查看效果。
- 适用场景：前端开发中处理 SVG 图标、调整 SVG 路径、优化 SVG 代码。
- 特色：支持放大缩小预览、复制 SVG 代码，兼容大多数 SVG 特性。
15. 程序员鼓励师：Rainbow Fart
- 核心功能：在编码过程中根据输入的关键字触发语音赞美，例如输入 function 时播放 "写得真棒！"，输入 if 时播放 "逻辑清晰，太厉害了！"。支持多语言语音包（中文、英文等），赞美内容与代码语境关联。
- 适用场景：单人开发时缓解编码疲劳，增添趣味性；团队协作时活跃开发氛围；新手学习编程时获得正向反馈。
- 高级功能：支持自定义语音包（可录制个人或团队专属鼓励语音）、配置触发关键字规则、调整音量和触发频率，兼容多种编程语言。
- 文档：传送门
16. 命名风格转换：Name Transform
- 核心功能：一键转换变量名、函数名的命名风格，支持 camelCase（小驼峰）、PascalCase（大驼峰）、snake_case（下划线）、kebab-case（短横线）等常见格式的相互转换。
- 适用场景：接手不同风格的代码时统一命名规范；调用第三方 API 时适配参数命名格式；重构代码时批量修改命名风格。
- 高级功能：支持选中区域批量转换、配置默认转换规则、自定义命名风格映射表，可集成到右键菜单或快捷键（默认 Alt+Shift+T）快速触发。
17. 代码拼写检查器：Code Spell Checker
- 核心功能：实时检查代码中的单词拼写错误（如变量名、注释、字符串中的英文单词），通过下划线标记错误，并提供修正建议。
- 适用场景：避免因拼写错误导致的 Bug（如变量名拼写错误 usre 而非 user）；优化代码注释和文档的可读性；英文非母语开发者提升代码规范性。
- 高级功能：支持添加自定义词典（忽略项目专属术语或缩写）、配置语言规则（支持英语、法语等多语言）、批量修复重复拼写错误，可集成到 CI/CD 流程中进行拼写检查。
18. 自动修改标签名：Auto Rename Tag
- 核心功能：在 HTML、XML、JSX、Vue 等标记语言中，修改开始标签时自动同步更新对应的结束标签，无需手动修改配对标签。
- 适用场景 ：前端开发中修改 HTML/JSX 标签（如将
改为 时，结束标签 自动变为 ）；编辑 XML 配置文件或 Vue 模板时避免标签不匹配问题。 - 高级功能：支持自定义匹配的标签语言（默认覆盖 HTML、Vue、React 等）、配置标签同步延迟时间、忽略自闭合标签，兼容嵌套标签结构。
19. 快速调试打印：Console Helper
- 核心功能：一键生成格式化的调试打印语句（如 console.log()、console.error()），自动填充变量名和上下文信息，支持快捷键快速插入。
- 适用场景：前端开发中快速添加调试日志；后端开发调试变量值或函数执行流程；临时排查代码逻辑问题时减少重复输入。
- 高级功能：支持自定义打印模板（如添加时间戳、文件名、行号）、一键注释 / 取消所有打印语句、自动删除冗余打印，兼容 JavaScript、TypeScript、Python 等多种语言。
20. 彩虹括号：Rainbow Brackets
- 核心功能：为嵌套的括号（圆括号、方括号、花括号）添加不同颜色，增强代码层次感。
- 适用场景：编写嵌套较深的代码（如 JSON 结构、条件语句、函数嵌套）时，快速识别括号配对关系。
- 自定义选项：支持调整颜色主题、忽略特定文件类型、配置括号样式。
如果看了觉得有帮助的，我是鹏多多，欢迎 点赞 关注 评论；
往期文章
- flutter-使用AnimatedDefaultTextStyle实现文本动画
- js使用IntersectionObserver实现目标元素可见度的交互
- Web前端页面开发阿拉伯语种适配指南
- 让网页拥有App体验？PWA 将网页变为桌面应用的保姆级教程PWA
- 助你上手Vue3全家桶之Vue3教程
- 使用nvm管理node.js版本以及更换npm淘宝镜像源
- 超详细！Vue的十种通信方式
- 手把手教你搭建规范的团队vue项目，包含commitlint，eslint，prettier，husky，commitizen等等
个人主页