# generator **Repository Path**: harmony-free/generator ## Basic Information - **Project Name**: generator - **Description**: 这是鸿蒙hvigor的一个根据配置自动生成文件库 - **Primary Language**: Unknown - **License**: MIT - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 1 - **Forks**: 0 - **Created**: 2025-05-28 - **Last Updated**: 2025-07-22 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # generator #### 介绍 [English](README.en.md) 这是鸿蒙hvigor的一个根据配置自动生成文件库 #### 软件架构 华为 hvigor 脚本 #### 安装教程 [点击下载lib](./lib) 1、手动导入 把下载好的.tgz包放入项目中，再`/hvigor/hvigor-config.json5`文件中引入 `XXX`替换存放路径 ``` /hvigor/hvigor-config.json5 { "dependencies": { "@free/generator": "file:../XXX.tgz" }, } ``` #### 使用说明 #### model 使用方式 1、在entry下hvigorfile.json5文件中引入 ``` /entry/hvigorfile.json5 import { jsonToModelPlugin } from '@free/generator'; // input: josn入口的地方 默认 /entry/json/ // out: model出口的地方 默认 /entry/model/ export default { system: hapTasks, plugins:[ jsonToModelPlugin(input?:string,out?:string) ] } ``` 2、执行命令`hvigorw --sync` #### router_map 使用方式 1、在entry下hvigorfile.json5文件中引入 ``` /entry/hvigorfile.json5 import { genNavRouterPlugin } from '@free/generator'; // 可传入过滤参数 filtrList 数组，默认过滤为 null，只生成当前模块 export default { system: hapTasks, plugins:[ genNavRouterPlugin() ] } ``` 2、执行命令`hvigorw --sync` 开始生成文件 3、在 @Component 上增加 @Router() ``` /// config?:RouterConfig 配置参数可以不填 /// name?:string|undefined 路由名称 示例 'home/page/name' 默认组件名称 例：HomePageName /// isParams?:boolean 是否携带参数 默认不带参数 false /// hideNavDes?:boolean 是否隐藏 NavDestination 的 titleBar 默认隐藏 false @Router() // 或者 @Router({name:"home/page/name"}) @Component export struct HomePageName{ // ... } ``` 4、跳转和回调， 非 entry 模块需要写成 '@模块名/HomePageName' ``` // push this.navPathStack.pushPathByName("home/page/name","hello", (res:PopInfo)=>{ console.log("this is a back parameter:" + JSON.stringify(res.result)); }) // pop this.navPathStack.pop("back parameter") ``` #### openCustomDialog 使用方式 1、在entry下hvigorfile.json5文件中引入 ``` /entry/hvigorfile.json5 import { genDialogPlugin } from '@free/generator'; // 可传入过滤参数 filtrList 数组，默认过滤为 null，只生成当前模块 export default { system: hapTasks, plugins:[ genDialogPlugin() ] } ``` 2、执行命令`hvigorw --sync` 开始生成文件 3、在 @Component 上增加 @FreeDialog() ``` /// config?:RouterConfig 配置参数可以不填 /// name?:string|undefined 弹窗名称 示例 'showApp' 默认组件名称 ShowAppComponent /// isParams?:boolean 是否携带参数 默认不带参数 false，true关联参数：params: DialogParams @FreeDialog() // 或者 @FreeDialog({name:"showApp"}) @Component export struct ShowAppComponent{ // ... } ``` 4、打开弹窗 ``` Dialog.show({name:"showApp",data:"hello dialog",onConfirm:(data)=>{ console.log("this is a back parameter:" + JSON.stringify(res.result)); }}) ``` 5、关闭弹窗 ``` this.params?.close!(CallBackStatus.confirm,"data") ``` #### 插件明细 hello 各位同学，大家好！ 今天我们来讲讲关于鸿蒙里的json自动生成model场景。很多同学很多时候在写model数据的时候总是会错写漏写某个参数，或者错写了参数的数据类型。使得在开发的过程中出现一些意料之外的错误，得通过多次调试才能定位到问题，这次我带各位同学通过hvigor脚本实现generator自动生成model，保证model的正确性。 一、首先创建一个Typescript项目，引入相关依赖。具体可以查看[hvigor插件开发](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/ide-hvigor-plugin)。顺带了解一下hvigor，hvigor是华为轻量级构建工具，可以通过编写js代码达到自动生成model。 ![](https://alliance-communityfile-drcn.dbankcdn.com/FileServer/getFile/cmtybbs/137/390/427/0080086000137390427.20250617104959.45816006082122898408488261424687:50001231000000:2800:91A434C399284E0ACF4F9CFA47414DF9626D7F217A2C1BA3C37581859C4E0706.png) 二、通过hvigor和fs-extra两个插件从json数据所在的path文件位置读取json文件中的数据。 1、遍历读取json文件 ``` traverseDirectory(path:string,complete: (dirent: fs.Dirent) => void){ fs.readdir(path, { withFileTypes: true },(err,dirents)=>{ if (err) { log(`Error reading directory ${path}:${err}`); return; } dirents.forEach((dirent)=>{ const fullPath = `${path}/${dirent.name}`; if (dirent.isDirectory()){ // 如果是文件夹，递归调用 fs.mkdir(`${this.config.out}/${dirent.name}`) this.traverseDirectory(fullPath,complete); }else{ complete(dirent) } }) }) } ``` 2、读取文件数据 ``` this.traverseDirectory(this.config.input,(dirent)=>{ let buf = fs.readFileSync(dirent.parentPath + "/" + dirent.name,{encoding:'utf-8'}) }) ``` 三、通过fs-extra插件创建model文件并且输出到out文件夹中。根据json文件创建model文件，通过jsonToModel将json数据转化为model数据，再写入到model文件。 1、将json数据转化model数据 ``` jsonToModel(json:object,name:string):string{ let data = Object.entries(json); let body = ""; let init = `\tconstructor(face:${name}Face) {\n\t\tif(face==null)`; let otherMap:Map = new Map() data.forEach((k)=>{ if(k[1] instanceof Array){ body += `\t${k[0]}:Array<${this.arrayToModel(k[0],k[1],otherMap,name)}> | undefined \n` }else if(k[1] != null && typeof k[1] == "object"){ let objName = name + k[0].substring(0, 1).toUpperCase() + k[0].substring(1); otherMap.set(objName,k[1]) body += `\t${k[0]}:${objName}Model | undefined \n` }else{ body += `\t${k[0]}:${typeof k[1]} | undefined \n` } init += `\t\tthis.${k[0]} = face.${k[0]} \n` }) let model = `export interface ${name}Face{ \n ${body}}\n\n` model += `export class ${name}Model implements ${name}Face{\n${body}\n}\n\n` otherMap.forEach((v,k)=>{ model += this.jsonToModel(v,k) }) return model } // 处理数组嵌套问题 arrayToModel(k:string,v:Array,otherMap:Map,name:string):string{ if(v.length > 0){ if(typeof v[0] == "object"){ if(v[0] instanceof Array){ return `Array<${this.arrayToModel(k,v[0],otherMap,name)}>`; }else{ let objName = name + k.substring(0, 1).toUpperCase() + k.substring(1); otherMap.set(objName,v[0]) return objName + "Model" } }else{ return typeof v[0] } }else{ return "object" } } ``` 2、根据创建model文件并将model数据写入model文件 ``` this.traverseDirectory(this.config.input,(dirent)=>{ let buf = fs.readFileSync(dirent.parentPath + "/" + dirent.name,{encoding:'utf-8'}) let fileName = dirent.name.split('.')[0]; fileName = fileName.substring(0, 1).toUpperCase() + fileName.substring(1); const filePath = `${this.config.out}/${fileName}.g.ets`; let model = this.jsonToModel(JSON.parse(buf),fileName) fs.writeFileSync(filePath,model) }) ``` 注意：完整代码我已提交到[代码仓库](https://gitee.com/harmony-free/generator)，前往[下载.tgz包](https://gitee.com/harmony-free/generator/tree/master/lib) 1、手动导入 把下载好的.tgz包放入项目中，在`/hvigor/hvigor-config.json5`文件中引入 `XXX`替换存放路径 ``` /hvigor/hvigor-config.json5 { "dependencies": { "@free/generator": "file:../XXX.tgz" }, } ``` 2、在entry下hvigorfile.json5文件中引入 ``` /entry/hvigorfile.json5 import { jsonToModelPlugin } from '@free/generator'; // input: josn入口的地方 默认 /entry/json/ // out: model出口的地方 默认 /entry/model/ export default { system: hapTasks, plugins:[ jsonToModelPlugin(input?:string,out?:string) ] } ``` 3、执行命令`hvigorw --sync` ![](https://alliance-communityfile-drcn.dbankcdn.com/FileServer/getFile/cmtybbs/137/390/427/0080086000137390427.20250617112745.16036371874079713910992205651937:50001231000000:2800:AC9344AF3B1CAC38757737C4743BA012148629FA3BF1ECEF3D35C129883A6F80.png) 喜欢本篇内容的话给个小爱心！ #### 参与贡献 1. Fork 本仓库 2. 新建 Feat_xxx 分支 3. 提交代码 4. 新建 Pull Request #### 特技 1. 使用 Readme\_XXX.md 来支持不同的语言，例如 Readme\_en.md, Readme\_zh.md 2. Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com) 3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目 4. [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目，是综合评定出的优秀开源项目 5. Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help) 6. Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)