1

Today I will introduce " any-type ", a vscode plugin, which can generate typescript types based on javascript literals.

GIF

🔥 Usage scenarios

In ts, for the data requested by axios, we have to manually mark the type for the following operations, such as:

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

Here the " ResponseData " type is the description of the interface. The following simulates a sales statistics interface.

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

Its type description:

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

: "The more complex the 161e8c2345dd6d interface, the more complex the type ".

⚡any-type

This type can be generated by " any-type ". The operation is also very simple:

  1. Press the " F1 " key, enter "generate , find "⚡ generate typescript type (generate ts type)", press Enter.
    image
  2. JSON data in the newly popped up input box.
    1
  3. Enter , "Type" will automatically insert the type into the editor.
    2

🌈 Install

any-type " in the vscode store.

⭐github

If you think any-type is good, please give me a little star. 😁
https://github.com/any86/any-type

plan

  • [x] Enter the interface address, initiate an http request, and parse the return value.

🍭 For better ideas please leave a message

🍕Learn to interact

Thank you for reading. If you have any questions, you can add me on WeChat, and I will pull you into the WeChat group (due to Tencent's 100-member limit on WeChat groups, after more than 100 members must be pulled in by group members)


铁皮饭盒
5k 声望1.2k 粉丝

喜欢写程序: [链接]