在 Visual Studio Code 中自动格式化 JSON 文件

问题描述

当使用 Visual Studio Code 查看 JSON 文件时，经常会遇到单行压缩格式的 JSON 数据，这种格式难以阅读和理解。虽然 VS Code 提供了手动格式化的功能，但在频繁查看和编辑 JSON 文件时，反复执行格式化操作（Shift+Alt+F + Ctrl+S）变得十分繁琐。

用户希望找到一种方法，能够自动将所有 *.json 文件以预先格式化（美化）的方式显示，避免手动操作的不便。

解决方案

方法一：使用内置快捷键（推荐）

Visual Studio Code 内置了强大的代码格式化功能，无需安装额外扩展即可格式化 JSON 文件：

Windows

Shift + Alt + F

Mac

Shift + Option + F

Linux

Ctrl + Shift + I

这些快捷键会调用 VS Code 内置的 JSON 格式化器，立即将压缩的 JSON 转换为易读的格式化版本。

方法二：配置保存时自动格式化

要实现真正的自动格式化，可以配置 VS Code 在保存文件时自动执行格式化：

1. 打开 VS Code 设置（文件 > 首选项 > 设置，或使用 Ctrl+, 快捷键）
2. 搜索 editor.formatOnSave
3. 勾选该选项或设置为 true

现在，每次保存 JSON 文件时，VS Code 会自动对其进行格式化。

方法三：检查 JSON 格式化设置

注意事项

如果发现格式化效果不理想，请检查以下设置：

1. 打开设置并搜索 JSON > format: Keep Lines
2. 确保此选项处于禁用状态（默认值）
3. 如果启用此选项，单行 JSON 文件可能无法正确格式化

方法四：使用扩展增强功能

虽然内置功能已经足够强大，但某些扩展可以提供额外的格式化选项：

• Meezilla JSON Formatter：提供快速美化功能（使用 Cmd/Ctrl+Shift+J）
• JSON Prettifier：专门用于 JSON 格式化的扩展

建议

对于大多数用户，使用 VS Code 内置的格式化功能并结合保存时自动格式化设置已经足够。只有在需要特殊格式化需求时才考虑安装额外扩展。

最佳实践配置

要实现完全自动化的 JSON 格式化体验，推荐以下配置：

1. 启用 editor.formatOnSave - 保存时自动格式化
2. 禁用 JSON > format: Keep Lines - 确保完整格式化
3. 学习使用快捷键 - 用于即时格式化需求

总结

Visual Studio Code 提供了强大的内置 JSON 格式化能力，通过简单的快捷键或配置保存时自动格式化，可以轻松解决查看压缩 JSON 文件的困扰。无需依赖外部扩展，使用原生功能即可获得优秀的格式化体验。

对于大多数开发场景，建议使用内置快捷键结合保存时自动格式化的配置，这样既能保持代码整洁，又不会增加额外的扩展依赖。