@chenhailong/codegen

特点

• 灵活：结果 = 数据（无限扩展）+ 模版（无限扩展）
• 无限扩展性： codegen/data.config.js 支持字段无限扩展； 模版支持逻辑编写
• 书写方便： 模版所见即所得（语法简单、可加逻辑）
• 运行环境：需要有node环境就可运行
• 兼容性好：因为模版无限制，所以生成任意语言代码=》小程序、vue、react、dart、flutter、java等
• 支持git：项目有git仓库，自动读取git用户信息
• 提示友好：

新版本

• 安装 $ npm install -g @chenhailong/codegen
• 运行 $ codgen

                     _           ____                
   ___    ___     __| |   ___   / ___|   ___   _ __  
  / __|  / _ \   / _` |  / _ \ | |  _   / _ \ | '_ \ 
 | (__  | (_) | | (_| | |  __/ | |_| | |  __/ | | | |
  \___|  \___/   \__,_|  \___|  \____|  \___| |_| |_|
                                                     
简介：代码生成工具v0.0.40 @mail:[e-mail]

Usage: codegen [global options] command

Options:
  -V, --version   output the version number
  -h, --help      display help for command

Commands:
  init            init code gen config
  gen [options]   gen code from config
  git             get git info
  help [command]  display help for command

• 运行 $ codegen gen --help

                     _           ____                
   ___    ___     __| |   ___   / ___|   ___   _ __  
  / __|  / _ \   / _` |  / _ \ | |  _   / _ \ | '_ \ 
 | (__  | (_) | | (_| | |  __/ | |_| | |  __/ | | | |
  \___|  \___/   \__,_|  \___|  \____|  \___| |_| |_|
                                                     
简介：代码生成工具v0.0.40 @mail:[e-mail]

Usage: codegen gen [options]

gen code from config

Options:
  -t, --target [mode]   Which [page、cmp、pageKeys] to use
  -n, --nameCmp [name]  Which name to use
  -h, --help            display help for command

Examples:

  $ codegen gen -t page，生成页面
  $ codegen gen -t cmp， 生成组件
  $ codegen gen -t pageKeys, 解析json生成页面字段，用于data.config.js 中的 attributes
  $ codegen gen -t type, 解析json生成typescript type

• 常用命令

$ codegen init
$ codegen gen -t pageKeys
$ codegen gen -t page
$ codegen gen -t cmp

配置说明

codeGen
├── cache.js // 配置文件
├── component.fun.tsx.tpl
├── component.tsx.tpl
├── data.config.js // 数据文件
├── data.json.js // json对象（约定接口字段）文件
├── hooks
│   └── definition.ts.tpl
└── tpls
    └── definition.ts.tpl

2 directories, 7 files`

• codegen/cache.js

/*
 * @version: v0.0.1
 * @Author: hailong.chen <[e-mail]>
 * @Date: Wed Sep 23 2020 15:59:15 GMT+0800 (GMT+08:00)
 * @LastEditors: hailong.chen
 * @Descripttion: 用于生成页面的配置信息
 */
const codegenConf={
  "datapath": "/codegen/data.config.js", // 产出页面路径，请替换
  "outDir": '/src', // 产出页面路径，请替换
  "tplpath": "/tpl", // 自定义模版路径
  "codeType": "react", // 自定义模版路径
  "suffix": "ts",
}
module.exports = codegenConf

• codegen/data.config.js

/*
 * @version: v0.0.1
 * @Author: {{{author}}}
 * @Date: {{gmtTime}}
 * @LastEditors: {{{author}}}
 * @Descripttion: 
 */
const config={
  "path": "pages/hello", // 产出页面路径，请替换
  "type": "page", // 页面类型（暂未使用），请替换
  "title": "你好", // 页面标题，请替换
  "apiPath": "", // 后端约定接口包
  // 注：支持字段无限扩展 && 模版支持逻辑编写（扩展性好）
  "statistic": [],// 页面统计部分，请替换
  "attributes": [ // 页面字段，请替换
   { "key": "status", "type": "number", "annotation": "状态" },
   { "key": "checkDate", "type": "string", "annotation": "盘库日期" },
   { "key": "userId", "type": "number", "annotation": "经办人id" },
   { "key": "userName", "type": "string", "annotation": "经办人" },
   { "key": "checkNo", "type": "string", "annotation": "库存单号" },
   { "key": "remark", "type": "string", "annotation": "备注" },
   { "key": "preparedTime", "type": "string", "annotation": "制单日期" },
   { "key": "preparedUserId", "type": "number", "annotation": "制单人id" },
   { "key": "preparedUserName", "type": "string", "annotation": "制单名称" },
   { "key": "approveTime", "type": "string", "annotation": "审核日期" },
   { "key": "approveUserId", "type": "number", "annotation": "审核人ID" },
   { "key": "approveUserName", "type": "string", "annotation": "审核人" },
   { "key": "bookkeeperTime", "type": "string", "annotation": "记账日期" },
   { "key": "bookkeeperUserId", "type": "number", "annotation": "记账人ID" }
  ]
}
module.exports = config

优化点

1、将test0001-cli 更改为(CG:code gen) codegen 
2、增加一个 init 交互命令
3、增加一个 --help -h 交互命令
解释：
	1、模版使用语法
		%=可解析变量=%
		%={不解析变量}=%
4、ts 、 webpack重新写一个

版本 < v0.0.15

# 创建文件夹
mkdir demo && cd demo
# git 初始化项目
# git 初始化项目，cli需要获取git信息生成文件头注释
# 使用cli
npx @chenhailong/test001-cli
# 项目首次使用会初始化项目的配置信息
# codegen/cache.js
# codegen/data.config.js
# 再次运行，执行模版语法生成页面

TODO

1. 可配置输出 现有默认输出，不能满足不同项目架构环境，将增加配置输出，由用户指定输出路径
2. 路由自动更新 程序在生成页面后，仍然需要手动配置路由，有点重复劳动，将参考 <react-codemod ｜ 采用读取更新的方式> 进行动态配置
3. 逆向工程 注：可以根据页面逆向生成模版，模版将越来越多，书写代码将越来越少