VSCode 默认不支持 JSON 字符串内联格式化
你是不是也遇到过这种情况？在代码里选中一段 JSON 字符串，满怀期待地按下 Shift+Alt+F，结果 VSCode 却弹出一个冷冰冰的提示：“没有可用的格式化程序”。这事儿其实不怪编辑器，它默认的 JSON 语言模式只认 .json 后缀的文件，对于嵌在代码里的字符串片段，它压根儿就没打算处理。所以，核心思路就一个：得先让 VSCode “认出”这段文本是 JSON，然后才能调用格式化工具。
用正则临时转成 .json 文件再格式化（最稳）
这招最适合处理那些“独立”的 JSON 片段，比如从日志里扒出来的、从 API 响应里复制过来的，或者就是一段纯粹的 JSON 文本。它的原理简单粗暴：把字符串包装成一个合法的 JSON 文件，借用 VSCode 对 .json 文件的原生支持来完成格式化。
具体操作可以这么来：
- 首先，复制你的 JSON 字符串。比如这么一段挤在一起的：
{"users":[{"id":1,"active":true}],"total":1}。 - 接着，在 VSCode 里新建一个临时文件，务必把后缀名改成
.json，比如就叫temp.json。 - 把内容粘贴进去后，重点来了：如果这段字符串本身被双引号包裹着（比如
"{...}"），你需要用正则替换去掉首尾引号。按Ctrl+H打开替换面板，点亮那个代表正则表达式的.*按钮，在“查找”框里输入^"(.*)"$，在“替换为”框里输入$1，然后执行替换。如果原始内容没有外层引号，这步可以跳过。 - 最后，保存这个文件，再按下神奇的
Shift+Alt+F，你会看到内容立刻变得层次分明。格式化完成后，把美观后的 JSON 复制回原来的地方就行了。
这个方法虽然多了一步创建文件的步骤，但胜在稳定可靠，几乎能处理所有情况。
装 Prettier + 配置 JSON-in-String 支持（适合高频使用）
如果你经常需要和代码里内联的 JSON 字符串打交道，比如像 const config = '{"id":1,"name":"test"}'; 这样的场景，那么配置 Prettier 是一个更一劳永逸的方案。不过，这里有个关键点：需要明确启用它对 JSON 字符串的解析能力。
操作路径如下：
- 第一步，去扩展市场安装由 Esben Petersen 开发的
Prettier扩展。 - 第二步，在项目根目录下创建一个名为
.prettierrc的配置文件。里面需要特别指定解析器：{ "parser": "json-stringify", "tabWidth": 2, "useTabs": false }。这个"json-stringify"就是告诉 Prettier 去处理字符串化的 JSON。 - 使用时，在代码编辑器里，用鼠标精确选中整个 JSON 字符串，包括最外层的单引号或双引号。然后右键点击，选择
Format Selection With...，并在列表里选择Prettier。
需要警惕的是，选中的内容必须是合法的 JSON 格式，不能包含 Ja vaScript 的注释（// 或 /* */）或者使用单引号作为属性名引号，否则 Prettier 也会无能为力。
快捷键冲突与语言模式陷阱
即便你已经装好了 Prettier，直接按 Shift+Alt+F 也可能不奏效。这是因为 VSCode 的行为取决于当前文件的“语言模式”。在一个 Ja vaScript 文件里，默认的格式化器是处理 JS 的，它不会自动切换到 Prettier 的 JSON 字符串模式。
这里有几个常见的坑和解决办法：
- 首先，看一眼编辑器右下角的状态栏，确认语言模式是
Ja vaScript或JSON，而不是Plain Text。 - 在 JS 文件中操作时，务必用鼠标完整选中从开头引号到结尾引号的整个字符串。只选中花括号内部的内容，格式化命令是无法生效的。
- 另外，注意
editor.formatOnSa ve这个设置只针对保存整个文件时触发，对选中部分格式化没有影响。所以，依赖右键菜单的Format Selection才是正确姿势。
说到底，并不存在一个真正意义上的“万能一键格式化”。关键在于分清场景：遇到独立的 JSON 文本片段，用临时文件法最稳妥；而要处理代码里内嵌的 JSON 字符串，则配置 Prettier 并手动选中才是高效之道。别指望编辑器能自动猜中你的心思，精确的指令和正确的工具组合，才是解决问题的关键。
