结构化 SQL 生成器

大家好，我是TJ

关注TJ君，回复“武功秘籍”免费获取计算机宝典书籍

TJ君将之前发过的各种项目及工具进行了整理，收录到了GitHub项目，欢迎各位小伙伴光临Star，地址如下：https://github.com/Wechat-TJ/TJ-WORLD-FORU

今天TJ君要和大家分享一个不错的小玩意，结构化 SQL 生成器，sql-generator

sql-generator，总的来说，是用JSON来生成结构化的 SQL 语句，基于 Vue3 + TypeScript + Vite + Ant Design + MonacoEditor 实现，整个项目相对比较简单（重逻辑轻页面）、适合新人练手~

项目的整体概念如下：

• 将 SQL 的编写逻辑 结构化 ，像写文章大纲一样编写和阅读 SQL
• 重复的 SQL 只需编写一次 ，SQL 变动时修改一处即可
• 可以针对某部分 SQL 进行传参和调试
• 查看 SQL 语句的引用树和替换过程，便于分析理解 SQL

那什么时候最适合使用呢？当小伙伴们要写一句复杂的SQL，其中部分代码又是雷同但不完全相同的，那么用上这个项目肯定能提高你的效率。

sql-generator，优势在于：

• 支持在线编辑 JSON 和 SQL，支持代码高亮、语法校验、一键格式化、查找和替换、代码块折叠等，体验良好
• 支持一键生成 SQL
• 支持参数透传，比如 @a(xx = #{yy})，yy 变量可传递给 @a 公式
• 支持嵌套传参（将子查询作为参数），比如 @a(xx = @b(yy = 1))
• 不限制用户在 JSON 中编写的内容，因此该工具也可以作为重复代码生成器来使用
• 支持查看 SQL 语句的调用树和替换详情，便于分析引用关系

那项目是怎么实现的呢？

作者使用和JSON相性最好的JavaScript来实现，编写一份逻辑JS 文件，可同时应用于browser和server端。

功能比较轻量，因此选择优先在纯browser端实现。

前端使用 Vue3 + Vite + Ant Design Vue 开发界面，选用 Monaco Editor 实现代码编辑、高亮、格式化等功能，使用 TypeScript + ESLint 保证代码规范。

SQL 生成逻辑如下：

• JSON 字符串转对象
• 从入口开始，先替换 params 静态参数，得到当前层解析
• 对 @xxx 语法进行递归解析，递归解析时，优先替换静态参数，再替换外层传来的调用参数
• 得到最终 SQL

最简单的示例就是将如下代码放入到生成器中，试一试马上就会学会：

{
  "main": "必填, 代码从这里开始生成, 用 @规则名() 引用其他语句",
  "规则名": "可以编写任意 SQL 语句 @规则名2() @动态传参(a = 求给 ||| b = star)",
  "规则名2": {
    "sql": "用 #{参数名} 指定可被替换的值",
    "params": {
      "参数名": "在 params 中指定静态参数, 会优先被替换"
    }
  },
  "动态传参": "#{a}鱼皮#{b}"
}

项目还提供在线的调试使用环境：

小伙伴们可以自己先尝试用一下，觉得不错的话可以再部署本地哦~

点击下方卡片，关注公众号“TJ君”

回复“sql生成2022”，获取仓库地址

关注我，每天了解一个牛x、好用、有趣的东东

往期推荐