Json2ts

中文 | English

使用编译原理，解析 Json，输出 TS 类型

json-parse > transform > codegen

在线链接

vscode 插件

plugin

github

Features

• 支持层级嵌套
• 支持数组解析
• 支持行内和换行的注释解析
• 支持 key 值无引号模式

Install

npm i @cyly/json2ts

// or

yarn add @cyly/json2ts

// or

pnpm i @cyly/json2ts

// or

<script src="index.umd.min.js"></script>

json2ts.json2ts(`{ name: 'apha' }`, {
    semicolon: true
});

Document

json2ts

import json2ts from '@cyly/json2ts'

const json = `{
  "a": 123,
  "b": {
    "c": "123"
  },
  d: [1, 2, 3]
}`

const result = json2ts(json, {
  semicolon: true,
})

options

splitType

boolean。默认：true。是否分离对象，分离的话，会将 json 内的对象作为单独的 type 类型

parseArray

boolean。默认：false。是否解析数组。默认返回 Array< any >

required

boolean。默认：true。是否都是必须。设为false则为：{ a?: number};

semicolon

boolean。默认：false。是否使用分号结尾。设为true则为：{a: number; b: string;}

typePrefix

string。默认：''。命名的前缀。如设为User：UserKeyName$0

typeSuffix

string。默认：Type。命名的后缀。如设为Temp：KeyName$0Temp

indent

number。 Default：2。 输出格式化的缩进

comment

'inline' | 'block' | false。 默认false。是否输出注释

optimizeArrayOptional

boolean. 默认false。优化数组内对象的值是否可选。例如： [{a: 1, b: 3}, {b: 2}] will be Array<{a: number; b?: number}>

genType

'type' | 'interface'. 默认type. 输出 type 或 interface

parse

import { parse } from '@cyly/json2ts'

const json = `{
  "a": 123,
  "b": {
    "c": "123"
  },
  d: [1, 2, 3]
}`

const ast = parse(json)

traverser

import { traverser, STRING_TYPE, ARRAY_TYPE } from '@cyly/json2ts'

const json = `{
  "a": 123,
  "b": {
    "c": "123"
  },
  d: [1, 2, 3]
}`

const ast = parse(json)

traverser(ast, {
  [STRING_TYPE]: {
    entry(node, parent) {},
    exit(node, parent) {},
  },
  [ARRAY_TYPE]: {
    entry(node, parent) {},
    exit(node, parent) {},
  },
})

{
  "a": 123,
  "b": {
    "c": "123"
  },
  d: [1, 2, 3]
}

=>

{
    "key": "root",
    "type": "Root",
    "value": [{
        "key": "a",
        "value": "123",
        "type": "number",
        "loc": {
            "start": {
                "offset": 1,
                "column": 2,
                "line": 1
            },
            "end": {
                "offset": 8,
                "column": 9,
                "line": 1
            },
            "source": "\"a\":123"
        }
    },
    {
        "key": "b",
        "value": [{
            "key": "c",
            "value": "123",
            "type": "string",
            "loc": {
                "start": {
                    "offset": 14,
                    "column": 15,
                    "line": 1
                },
                "end": {
                    "offset": 23,
                    "column": 24,
                    "line": 1
                },
                "source": "\"c\":\"123\""
            }
        }],
        "type": "Object",
        "loc": {
            "start": {
                "offset": 9,
                "column": 10,
                "line": 1
            },
            "end": {
                "offset": 24,
                "column": 25,
                "line": 1
            },
            "source": "\"b\":{\"c\":\"123\"}"
        }
    },
    {
        "key": "d",
        "value": [{
            "key": "$ARRAY_ITEM$",
            "value": "1",
            "type": "number",
            "loc": {
                "start": {
                    "offset": 30,
                    "column": 31,
                    "line": 1
                },
                "end": {
                    "offset": 31,
                    "column": 32,
                    "line": 1
                },
                "source": "1"
            }
        },
        {
            "key": "$ARRAY_ITEM$",
            "value": "2",
            "type": "number",
            "loc": {
                "start": {
                    "offset": 32,
                    "column": 33,
                    "line": 1
                },
                "end": {
                    "offset": 33,
                    "column": 34,
                    "line": 1
                },
                "source": "2"
            }
        },
        {
            "key": "$ARRAY_ITEM$",
            "value": "3",
            "type": "number",
            "loc": {
                "start": {
                    "offset": 34,
                    "column": 35,
                    "line": 1
                },
                "end": {
                    "offset": 35,
                    "column": 36,
                    "line": 1
                },
                "source": "3"
            }
        }],
        "type": "Array",
        "loc": {
            "start": {
                "offset": 25,
                "column": 26,
                "line": 1
            },
            "end": {
                "offset": 36,
                "column": 37,
                "line": 1
            },
            "source": "\"d\":[1,2,3]"
        }
    }]
}

=>

{
  a: number,
  b: {
    c: string
  },
  d: Array< number >;
}