在TypeScript的世界里，Java程序员常常怀念Java中的注解（Annotation）功能，那种简洁、强大的元数据描述能力。现在，有了 easy-descriptor，你可以享受到类似Java注解的体验，同时轻松构建前端页面的jsonSchema和axios请求API方法。

快速上手

安装 easy-descriptor：

npm i easy-descriptor

模型定义与jsonSchema生成

easy-descriptor 提供了一个@Model装饰器，让你能够轻松定义数据模型，并自动生成jsonSchema。例如

@Model()
export class ModelTest extends BaseModel<ModelTest> {
    @Field('名称', {test: '123'})
    name?: string;
    
    @Field('年龄', {test: 'sd', test2: 123, label: 'age', hidden: false, labelWidth: 120})
    age?: number;
}
const jsonSchema = useModelOptions(ModelTest)

只需调用useModelOptions，即可得到jsonSchema，无需繁琐的手动构建。

jsonSchema = {"fields":{"id":{"hidden":true,"label":"ID","key":"id"},"createTime":{"hidden":true,"label":"创建时间","key":"createTime"},"name":{"test":"123","label":"名称","key":"name"},"age":{"test":"sd","test2":123,"label":"年龄","hidden":false,"labelWidth":120,"key":"age"}},"perms":"model-test","api":"model/test","name":"ModelTest"}

---

优雅的API调用

对于axios请求，easy-descriptor的@Axios和@Http装饰器让你能够简洁地定义HTTP请求。例如：

@Axios('/api')
export class TestAxios {
    @Get('/getData/{id}')
    declare httpGet: HttpRequest
    
    @Post('/save')
    static staticPost: HttpRequest
}
const formData = {...}
TestAxios.staticPost(formData).then((resp: any) => {
    console.log('staticPost: ', resp.data)
})

const testAxios = new TestAxios()
// url地址包含占位参数: id,请求参数添加相应的数据: {id: 123}
testAxios.httpGet({id: 123}).then((resp: any) => {
    console.log('httpGet: ', resp.data)
})

---

这样，你就可以直接通过实例方法调用HTTP请求，代码更清晰，维护更容易。

借鉴Java 注解，提升开发效率

easy-descriptor 借鉴了Java注解的模式，允许你在TypeScript中定义丰富的元数据，这不仅提高了代码的可读性，也提升了开发效率。通过扩展FieldOption，你可以自定义字段的属性，满足各种场景需求。 总结 easy-descriptor 是Java程序员转战TypeScript的理想伙伴，它让你能够充分利用注解的力量，轻松构建前端数据模型和API接口。无论是jsonSchema的自动化生成，还是axios请求的优雅定义，easy-descriptor 都将帮助你编写出更加整洁、高效的TypeScript代码。立即尝试，开启你的TypeScript注解之旅吧！

源码

github源码