# tool_json_parse

**Repository Path**: seekdome/tool_json_parse

## Basic Information

- **Project Name**: tool_json_parse
- **Description**: json解析工具
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-05-15
- **Last Updated**: 2026-05-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# JSON Parser - WASM + React + TailwindCSS

基于 Rust WASM 的前端 JSON 解析工具，提供高性能的 JSON 解析、格式化、压缩、验证、转义及 Unicode 转换功能。

## 技术栈

| 层次 | 技术 |
|---|---|
| 解析引擎 | Rust → wasm-bindgen → WebAssembly |
| 前端框架 | React 19 + TypeScript |
| 样式 | TailwindCSS 4 |
| 构建工具 | Vite 6 + wasm-pack |

## 功能一览

| 功能 | 按钮 | 说明 |
|---|---|---|
| 解析 | `▶ 解析` | 将 JSON 解析为可折叠的树形结构 |
| 格式化 | `格式化` | 美化 JSON 格式（2 空格缩进） |
| 压缩 | `压缩` | 去除 JSON 中所有多余空白 |
| 转义 | `转义` | 将文本中的特殊字符转义为 JSON 安全形式（`\n`、`\"`、`\\` 等） |
| 去转义 | `去转义` | 将转义后的文本还原为原始内容 |
| 中文→Unicode | `中文→Unicode` | 将中文字符转为 `\uXXXX` 形式，ASCII 字符保留 |
| Unicode→中文 | `Unicode→中文` | 将 `\uXXXX` 序列还原为对应 Unicode 字符 |
| 验证 | 自动 | 所有操作都会验证 JSON，失败时显示错误位置（行号+列号） |

## 项目结构

```
├── Cargo.toml              # Rust WASM crate 配置
├── index.html              # HTML 入口
├── package.json            # Node.js 依赖和脚本
├── vite.config.ts          # Vite 配置 (React/Tailwind/WASM 插件)
├── tsconfig.json           # TypeScript 配置
│
├── src/
│   ├── lib.rs              # Rust 核心逻辑 (8 个 WASM 导出函数)
│   ├── main.tsx            # React 入口
│   ├── App.tsx             # 主页面 (输入区域/输出区域/操作栏)
│   ├── TreeView.tsx        # JSON 可折叠树形视图组件
│   ├── wasm-loader.ts      # WASM 加载封装 & JS 绑定层
│   ├── index.css           # TailwindCSS 入口
│   ├── pkg.d.ts            # WASM 模块 TypeScript 类型声明
│   └── vite-env.d.ts       # Vite 环境类型声明
│
├── pkg/                    # wasm-pack 构建产物 (自动生成)
│   ├── json_parser_wasm_bg.wasm
│   ├── json_parser_wasm.js
│   └── ...
│
└── dist/                   # Vite 生产构建产物
```

## Rust WASM 接口

所有函数均返回 `ParseResult`：

```rust
pub struct ParseResult {
    success: bool,     // 是否成功
    data: String,      // 成功时的结果数据
    error: String,     // 失败时的错误信息
    line: usize,       // 错误行号
    column: usize,     // 错误列号
}
```

| 函数 | 说明 |
|---|---|
| `parse_json(input)` | 解析 JSON 为树形结构数据 |
| `format_json(input, indent)` | 格式化美化 JSON |
| `minify_json(input)` | 压缩 JSON |
| `validate_json(input)` | 验证 JSON 合法性 |
| `escape_json(input)` | 转义特殊字符 |
| `unescape_json(input)` | 还原转义字符 |
| `chinese_to_unicode(input)` | 中文 → `\uXXXX` |
| `unicode_to_chinese(input)` | `\uXXXX` → 中文 |

## 快速开始

```bash
# 安装依赖
npm install

# 构建 WASM (首次或修改 Rust 代码后)
npm run wasm:build

# 启动开发服务器
npm run dev

# 生产构建
npm run build

# 预览生产构建
npm run preview
```

## 开发

```bash
# 修改 Rust 代码后重新构建 WASM
npm run wasm:build

# 开发模式 (跳过 WASM 优化，编译更快)
npm run wasm:dev

# TypeScript 类型检查
npx tsc --noEmit
```

## 许可

MIT