vscode的代码折叠如何提升可读性【教程】-VSCode-PHP中文网

VS Code代码折叠直接影响开发效率，需针对性配置：默认仅折叠function/class等语法块，注释块需#region格式，JSON/Markdown等需设foldingStrategy为indentation或auto，并确保语言模式正确。

vscode的代码折叠如何提升可读性【教程】

VS Code 的代码折叠不是装饰功能，它直接影响你能否快速定位逻辑块、跳过无关细节、减少滚动疲劳。默认折叠行为对多数项目不够友好，需要针对性调整。

哪些代码块默认不折叠？怎么手动触发

VS Code 默认只对 function、class、if/for/while 块等语法结构自动提供折叠标记，但像注释块、长字符串、JSON 配置、Markdown 二级标题（##）或自定义区域（#region）默认不参与折叠。

用快捷键 Ctrl+Shift+[（Windows/Linux）或 Cmd+Shift+[（macOS）折叠光标所在区域；Ctrl+Shift+] 展开
在行号左侧点击小三角可手动折叠任意支持的块，但前提是该语言的语法定义已声明折叠范围（如 TypeScript 支持 interface 折叠，JavaScript 则不支持）
注释块需满足格式：以 // #region 开头、// #endregion 结尾（JS/TS），或 /* #region */ / /* #endregion */（C-style）

如何让 JSON、Markdown、HTML 等非编程文件也支持折叠

这些文件类型默认折叠能力弱，必须显式启用对应语言的折叠策略，否则即使有缩进或标签嵌套也不会显示折叠控件。

JSON Toolkit

JSON文件多功能工具。支持格式化、验证、压缩、键排序及点记法路径查询。零依赖。

下载

打开设置（Ctrl+,），搜索 editor.foldingStrategy，将其设为 indentation 可强制按缩进折叠（适合 Markdown、YAML、JSON）
对 HTML，确保安装了官方 HTML Language Features 扩展，并在设置中开启 html.suggest.html5 和 editor.foldingStrategy 设为 auto
JSON 文件若仍不折叠对象/数组，请检查是否被识别为 jsonc（带注释的 JSON）——VS Code 对 jsonc 的折叠支持更完整

折叠后符号混乱？别忽略 language-specific 配置

同一份代码，在不同语言模式下折叠行为可能完全不同。比如一个 .js 文件若被误识别为 plaintext，所有折叠功能都会失效；而 .ts 文件中 namespace 是否可折叠，取决于 TypeScript 版本和 "typescript.preferences.includePackageJsonAutoImports" 等配置间接影响解析器行为。

右下角状态栏点击当前语言标识（如 Plain Text），手动选为正确语言模式（TypeScript、JSON with Comments 等）

在 settings.json 中为特定语言单独配置折叠行为：

"[javascript]": {
  "editor.foldingStrategy": "auto",
  "editor.showFoldingControls": "mouseover"
}

editor.showFoldingControls 设为 always 会常驻显示三角图标，但会挤占行号宽度；设为 mouseover 更清爽，不过悬停延迟可能让人误以为没折叠功能

真正影响效率的不是“能不能折叠”，而是“折叠后你是否还敢信任它”——比如 TypeScript 中泛型约束过长时折叠掉类型参数，展开后发现实际是两个嵌套接口；或者 JSON 中折叠了某个 "children" 数组，结果里面混着 null 和对象，视觉上完全看不出结构断裂。这些细节不会报错，但会悄悄拖慢调试节奏。