更聪明的JSON格式化 FracturedJson
https://github.com/j-brooke/FracturedJson
📝 FracturedJson 是什么?
FracturedJson 是一款智能 JSON 格式化工具,核心特点是“断裂式排版”——它不会像传统格式化工具那样把每个键值对都单独占一行,而是会在一行内紧凑排列多个适合的条目,在保持 JSON 结构清晰的同时,大幅节省屏幕空间,让长 JSON 数据更易阅读。
✨ 核心特点
- 紧凑可读:短值、数组元素等会被合并到同一行,长值或复杂对象才会换行,平衡了紧凑性和可读性。
- 自适应布局:根据终端/编辑器宽度自动调整每行显示的条目数量,避免横向滚动。
- 保留注释:支持带注释的 JSON(JSON5 格式),格式化时不会丢失注释内容。
- 多场景适配:适合处理 API 响应、配置文件、日志等长 JSON 数据,尤其在终端或窄屏编辑器中体验极佳。
🎯 适用场景
- 开发调试:查看复杂 API 返回的 JSON 时,不用频繁滚动就能看到更多内容。
- 配置文件管理:让
package.json、tsconfig.json等配置文件更紧凑整洁。 - 日志分析:处理 JSON 格式的日志时,减少换行带来的视觉干扰。
🛠️ 快速使用方式
1. 命令行工具
安装后直接格式化 JSON 文件或管道输入:
# 安装(以 Node.js 版本为例)
npm install -g fracturedjson
# 格式化文件
fracturedjson input.json > output.json
# 管道输入(比如结合 curl)
curl https://api.example.com/data | fracturedjson
2. VS Code 插件
在 VS Code 中安装「Fractured Json」插件,右键 JSON 文件即可选择“Format Document With FracturedJson”一键格式化。
📊 对比普通 JSON 格式化
| 特性 | 普通 JSON 格式化 | FracturedJson |
|---|---|---|
| 单行元素数量 | 1 个/行 | 多个/行(自适应) |
| 屏幕空间利用率 | 低 | 高 |
| 长数据阅读体验 | 需要频繁滚动 | 减少滚动次数 |
| 注释支持 | 多数不支持 | 支持 JSON5 注释 |
FracturedJson 常用配置参数清单
这份清单覆盖 命令行工具 和 VS Code 插件 的核心配置项,可精准调整 JSON 排版规则,适配不同阅读习惯和场景。
一、 通用核心配置(命令行+VS Code 通用)
| 参数名 | 作用 | 默认值 | 可选值/说明 |
|---|---|---|---|
IndentationWidth |
缩进宽度(空格数) | 2 | 正整数,如 4 适合习惯 4 空格缩进的开发者 |
MaxInlineLength |
单行最大字符数,超过则换行 | 80 | 可根据终端/编辑器宽度调整,如窄屏设为 60 |
MaxInlineComplexity |
控制对象/数组是否内联的复杂度阈值 | 2 | 数值越小 → 越容易换行; 0 = 所有对象/数组都换行; 5 = 简单嵌套的对象/数组都内联 |
AllowTrailingCommas |
是否保留尾逗号 | false |
true/false;设为 true 适配 JSON5 格式 |
PreserveComments |
是否保留 JSON 注释(仅支持 JSON5) | true |
true/false;关闭则删除注释 |
SortObjectKeys |
是否按字母顺序排序对象的 key | false |
true/false;调试时设为 true 更易查找字段 |
二、 命令行专属配置参数
使用格式:fracturedjson --参数名 值 输入文件 > 输出文件
| 参数名 | 作用 | 示例 |
|---|---|---|
--format json |
指定输出格式(支持 JSON/JSON5) | fracturedjson --format json5 input.json > output.json5 |
--spaces 4 |
快捷设置缩进宽度(等价于 IndentationWidth=4) |
fracturedjson --spaces 4 input.json |
--no-comments |
禁用注释保留(等价于 PreserveComments=false) |
fracturedjson --no-comments input.json |
三、 VS Code 插件专属配置(修改 settings.json)
在 VS Code 的设置中搜索 Fractured Json,或直接编辑 settings.json 添加以下配置:
{
// 缩进宽度
"fracturedJson.indentationWidth": 4,
// 单行最大长度
"fracturedJson.maxInlineLength": 100,
// 开启尾逗号
"fracturedJson.allowTrailingCommas": true,
// 排序对象key
"fracturedJson.sortObjectKeys": true
}
四、 实用配置示例
1. 命令行:适合 API 调试的紧凑配置
# 4空格缩进 + 单行100字符 + 保留尾逗号
fracturedjson --spaces 4 --maxInlineLength 100 --allowTrailingCommas true api-response.json > formatted.json
2. VS Code:适合阅读超长日志的换行配置
{
"fracturedJson.maxInlineComplexity": 0, // 所有对象/数组强制换行
"fracturedJson.maxInlineLength": 60, // 窄屏适配
"fracturedJson.preserveComments": true // 保留日志注释
}
🎯 后端接口调试的具体用法(最常用的 3 种场景)
1. 命令行 + curl(实时格式化接口返回数据)
这是最直接的方式,无需额外工具,调用接口的同时就能格式化返回结果:
# 调用后端接口,将返回的 JSON 实时用 FracturedJson 格式化
curl -s "https://你的后端接口地址/api/data" | fracturedjson --spaces 4 --maxInlineLength 100
-s:让 curl 静默输出(去掉进度条等无关信息);- 管道
|:把接口返回的原始 JSON 传给 FracturedJson; --spaces 4/--maxInlineLength 100:按调试习惯调整缩进和单行长度。
效果对比:
- 原始接口返回(单行杂乱):
{"code":200,"msg":"success","data":{"id":1,"name":"测试","list":[1,2,3,4,5]}} - FracturedJson 格式化后(紧凑可读):
{ "code": 200, "msg": "success", "data": { "id": 1, "name": "测试", "list": [1, 2, 3, 4, 5] } }
2. Postman/Insomnia 等接口工具(自定义响应美化)
如果习惯用可视化接口工具,可把 FracturedJson 集成到响应处理中:
- 先调用接口,复制返回的原始 JSON;
- 打开 FracturedJson 在线版(https://j-brooke.github.io/FracturedJson/),粘贴 JSON 并调整配置(缩进、单行长度);
- 一键格式化,直接查看整理后的结构(比工具自带的格式化更紧凑)。
3. 后端代码内调用(格式化日志/返回值)
如果想在后端代码里直接格式化 JSON(比如打印调试日志),可集成 FracturedJson 对应的语言库:
- Node.js 后端:
const FracturedJson = require('fracturedjson'); const formatter = new FracturedJson.Formatter({ IndentationWidth: 4, MaxInlineLength: 100 }); // 后端接口处理逻辑 app.get('/api/data', (req, res) => { const responseData = { code: 200, msg: "success", data: { id: 1, list: [1,2,3] } }; // 格式化后打印调试日志 console.log("接口返回数据:", formatter.FormatJson(responseData)); res.json(responseData); }); - 其他语言(Java/Python):可使用 FracturedJson 对应的第三方封装库,核心逻辑一致。
✨ 调试时的核心优势(对比传统 JSON 格式化)
- 少滚动,看全字段:数组/短键值对会紧凑排列在一行,比如
list: [1,2,3,4,5],不用为每个数组元素翻页; - 适配窄屏/终端:
MaxInlineLength可限制单行长度,避免终端横向滚动; - 保留调试关键信息:支持保留 JSON 注释(如果接口返回 JSON5 格式),方便后端加临时调试备注。
总结
- FracturedJson 完全支持后端接口调试,核心是格式化接口返回的 JSON 数据;
- 最常用的方式是
curl + 管道,实时调用接口并格式化结果; - 相比传统格式化,它的“紧凑排版”更适合调试时快速查看字段结构,减少无效滚动。
评论区