作者:二冰
链接:https://www.zhihu.com/question/553411865/answer/1888681230062576918
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

告别烧脑!这款正则表达式神器让你秒变大神

兄弟们,你们有没有被正则表达式逼疯过?每次调试都要反复试错,复杂的模式连自己都看不懂。今天二冰要给大家安利一款开箱即用的神器——regex-vis,不仅能图形化展示正则逻辑,还能像搭积木一样可视化编辑!

项目简介

regex-vis是GitHub上斩获3.6k星的开源项目(项目地址:github.com/Bowen7/regex),它能将晦涩的正则表达式转化为直观的流程图。举个栗子,像校验身份证号这种复杂规则,用它能秒懂每个字符段的含义!

四大核心优势

  1. 1. 所见即所得:实时生成正则流程图,告别脑补模式
  2. 2. 可视化编辑:支持拖拽节点、组合分组等骚操作
  3. 3. 多端适配:Web端、Docker部署、群晖NAS都能跑
  4. 4. 测试神器:自带测试面板,绿色标记验证通过项

手把手部署教程

用Dockge部署只需三步:

打开Dockge面板 -> 创建堆栈 -> 设置堆栈名称 -> 粘贴compose代码 -> 30秒启动成功!

准备好compose文件:

version: '3'
services:
  regex-vis:
    image: wbsu2003/regex-vis
    container_name: regex-vis
    restart: unless-stopped
    ports:
      - 3420:80

实战演示

部署成功后,兄弟们可以这样玩转:

  1. 1. 模式解析:输入^[A-Za-z0-9.%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,}$秒懂邮箱校验逻辑
  2. 2. 图形编辑:点击任意节点,右侧面板可修改量词、添加分组
  3. 3. 实时测试:在Test面板输入文本,绿色高亮显示匹配结果

总结建议

经过实测,regex-vis特别适合这些场景:
✅ 教学演示:新手理解正则语法的救星
✅ 代码审查:快速定位复杂正则的逻辑漏洞
✅ 模式调试:可视化修改比console.log高效10倍

虽然项目暂不支持正则语法自动补全,但作为免费开源工具已经吊打很多商业软件。二冰强烈推荐给经常和正则打交道的兄弟,尤其是需要给团队做技术分享的老司机!

如果觉得有用,记得在评论区扣个666,收藏点赞走起!

最后,奉上我的超级无敌至尊docker库,二冰平时玩过的docker都整理到了这个仓库中了,一直在更新中,希望有github账号的兄弟能去给点个star,不知道玩啥的,都去这里面找,都给你们分好类了
仓库链接:
github.com/TWO-ICE/Awes