vs code json格式化只需三类工具:内置功能(vscode.json-language-features)、prettier(需手动配置parser)和命令行jq;避免插件冲突,优先排查编码、bom及响应体类型问题。

VS Code 里真正好用的 JSON 格式化工具,其实就 3 类:内置功能 + 插件 + 命令行集成。所谓“6个神器”大多是同一底层能力的重复包装,装多了反而冲突。
用 Shift+Alt+F 前先确认 editor.defaultFormatter 设为 vscode.json-language-features
VS Code 自带的 JSON 格式化器足够稳,但默认不接管所有 .json 文件——尤其当你装了 Prettier 或其他格式化插件后,Shift+Alt+F 可能直接失效或格式错乱。
- 打开设置(
Ctrl+,),搜default formatter,找到Editor: Default Formatter - 在
json语言下单独设置:点击右上角 “添加语言特定设置”,选JSON,填入vscode.json-language-features - 别信插件说的“一键启用”,它只改全局默认,不覆盖语言级配置
- 这个内置格式器不处理
package.json里的脚本字段换行,也不压缩空格——这是设计使然,不是 bug
prettier 插件对 JSON 的支持其实是“有限兼容”
很多人装 prettier 就为了格式化 JSON,但它默认不启用 JSON 支持,且和 VS Code 内置格式器抢夺控制权。
- 必须手动在
.prettierrc或prettier.config.js中加"parser": "json"才生效 - 一旦启用,
prettier会把true换成True(如果配了caseSensitive错误值)——这不是 JSON 合法写法,接口直接报Unexpected token - 它无法识别
.jsonc(带注释的 JSON)里的注释块,会删掉或报错,而内置格式器原生支持.jsonc - 若你同时需要格式化 JS/TS 和 JSON,建议只用
prettier管 JS/TS,JSON 交还给内置
遇到 Unexpected token N in JSON at position 0 别急着装新插件
这错误十有八九不是格式问题,而是你试图用 JSON 解析器读取非 JSON 内容——比如接口返回了 HTML 错误页、重定向响应、或 BOM 字节头。
- 先用
curl -v或浏览器 Network 面板看原始响应体,确认是不是真 JSON - VS Code 里右键文件 → “Reopen with Encoding” → 选
UTF-8,很多乱码或解析失败是 BOM 导致 - 如果内容来自剪贴板粘贴,注意是否混入了不可见的零宽字符(
\u200b),可用正则/[\u200b-\u200f\u202a-\u202f\u2060-\u206f\ufeff]/g清理 - 装“JSON Tools”这类插件并不能绕过语法校验,它只是把错误提示做得花哨点
命令行快速清理粘贴进来的脏 JSON:jq 是最可靠的离线方案
前端开发常从浏览器复制接口响应,里面夹杂换行、缩进不一致、甚至中文引号。VS Code 插件在这些场景下容易卡死或误判,jq 一行搞定。
- 安装:
brew install jq(macOS)或choco install jq(Windows) - 选中脏 JSON → 右键 → “Run Command”(需装 Code Runner)→ 输入:
jq '.',自动校验+格式化 - 要压缩成一行:
jq -c '.';要去掉注释(仅限.jsonc):jq -c 'fromjson'不行,得先用sed或node -e预处理 -
jq不依赖 VS Code,也不存在插件版本兼容问题,适合 CI 或脚本批量处理
真正卡住人的从来不是“找不到格式化工具”,而是没分清:哪部分该由编辑器做(语法高亮、基础缩进)、哪部分该由 CLI 做(校验、清洗、转换)、哪部分根本不是格式问题(编码、BOM、响应体类型)。工具链越短,出问题时越容易定位。











