likes
comments
collection
share

⚡any-type, 傻瓜化操作, json数据生成typescript类型

作者站长头像
站长
· 阅读数 30

今天给大家介绍我新开发的工具"any-type", 一个vscode插件, 他可以根据 javascript 字面量生成 typescript 类型.

⚡any-type, 傻瓜化操作, json数据生成typescript类型

🔥使用场景

在ts中, axios请求的数据, 为了后面的操作, 我们都是要手动标注类型的, 比如:

const response = await http.get<ResponseData>("/summary");

这里"ResponseData"类型就是对接口的描述. 下面模拟一个销量统计接口.

{
    "code":200, 
    "data": [
        {"name": "拼多多", "salesCount":"9999"},
        {"name": "阿里巴巴", "salesCount":"8888"},
        {"name": "京东", "salesCount":"7777"},
    ]
}

其类型描述:

type ResponseData = {
  code: number;
  data: { name: string; salesCount: string }[];
};

可以预想到: "接口越复杂, 类型就越复杂".

⚡any-type

这种类型我们可以通过"any-type"生成. 操作也很简单:

  1. 按"F1"键, 在控制台输入"generate" 找到"⚡ generate typescript type (生成ts类型)",回车. ⚡any-type, 傻瓜化操作, json数据生成typescript类型

  2. 在新弹出的输入框中输入JSON数据. ⚡any-type, 傻瓜化操作, json数据生成typescript类型

  3. 回车, "类型"会自动插入类型到编辑器. ⚡any-type, 傻瓜化操作, json数据生成typescript类型

🌈安装

在vscode商店中搜索"any-type".

⭐github

如果你觉得any-type不错, 请给我个小小的star吧. 😁 github.com/any86/any-t…

计划

  • 输入接口地址, 发起http请求, 解析返回值.

🍭有更好的想法请留言

typescript应知应会

🍕学习互动

感谢大家的阅读, 如有疑问可以加我微信, 我拉你进入微信群(由于腾讯对微信群的100人限制, 超过100人后必须由群成员拉入)

⚡any-type, 傻瓜化操作, json数据生成typescript类型

转载自:https://juejin.cn/post/7055097715994132516
评论
请登录