AI编程工具：我一直在用的5个，解决UI丑、API版本与代码定位难题

最近好多同学都在问我同一个问题：“Sunday 老师，有没有什么能让 AI 写代码靠谱点的工具推荐？”

一开始我还认真回，一条一条打字。打了几次之后，发现每次大家问的问题都差不多。

后来我就不打了，我说我写一篇吧，你们自己看吧。

结果，拖了快一个月才写。

拖这么久，也不全是懒哈～主要是一开始想推的东西太多了。MCP、Skill、插件、CLI，一个个都挺有意思的。

但是，我自己用下来发现，真正留在我项目里的，能经常用的，没几个。

大部分的插件安上之后，都是这个下场：装上，试一下，哦，挺酷，然后就没有然后了。过两周清理配置，发现它还在那儿，一次都没被打开过。

所以，这篇不打算写一堆“神器”，而是给大家推荐几个我一直在用的。

因此，这篇文章的推荐标准只有一个，那就是：这玩意儿现在还在我这儿装着，而且我确实用过不止一次。

那，开始吧。

01：Impeccable：让你的 UI 变得更高级

如果大家用 AI 写项目比较多的话，那么就会发现一个问题，那就是：AI 做出来的页面，长得都差不多。

你也说不出哪里丑吧，但就是别扭。

并且最大的问题是，这样的样式还不太好改。毕竟很多程序员（包括我）都不知道怎么从 0 做出来一个好看的 UI。

所以，大部分同学修改 UI 的时候提示词都是：“现在的样式太 Low 了，变得高级一点，你先琢磨琢磨什么是高级，就像 XXXX 那样”。

但是“高级”这俩词太抽象了，所以大多数情况下和 AI 来回掰扯好几遍也掰扯不明白。

那怎么办呢？

Impeccable 干的就是这个的。一句话来说就是：把“高级”拆成它能听懂的动作。

看看官方的介绍：

先说怎么装。在项目根目录跑一句：

npx impeccable install

它会问你这个工具是安装给哪个 agent 工具，比如我这里就选择 codex。

然后选择装给当前这个项目还是全局。

然后等它安装完成就可以了。用起来就是在对话框里点名加靶子：

/impeccable critique 首页的价格卡片

前头是命令，后头是靶子。靶子写得越具体越好，一个区块一个区块地来，比整页扫一遍有用得多。

它回你的是一份打分的设计评审：按可用性规则逐条打分，把该改的按先后排出来。排第一的那条，往往就是你自己看着别扭、又说不上来的那个东西。

改的时候换个词就行。嫌吵用 quieter，嫌字挤用 typeset，嫌间距乱用 layout，收尾想整体顺一遍用 polish。

一共有 24 个命令，官方分成六组：创建、评估、精修、简化、加固、系统。不用背，单敲一个 /impeccable，它自己会把清单列出来。

同时每一个命令点进去之后，都会有非常详细的效果介绍，比如 quieter 的效果。

不过它最擅长的还是改已经存在的页面。从零开始画一个它也能做，但效果不如反复迭代。

如果你经常觉得“这页面有点丑，但我说不出该怎么改”，可以先装这个。

02：Context7：API 版本验证

AI 写出了一个方法，然后在编辑器里面却显示这个 API 不存在。

然后你把报错扔回去，它换一种写法，还是不对。来回改了几次，最后发现，项目装的是新版本，它用的却是旧版本的参数。

比如 Zod，就是那个经常拿来校验表单和接口参数的库。到了 Zod 4，required_error、invalid_type_error 这两个自定义报错参数已经被移除了，统一用 error 来处理。拿旧教程里的代码直接往新项目里放，就可能在这里卡住。

Context7 值得考虑的地方，是它把常用库的文档和代码示例做成了一个专门的查询入口。AI 可以先找到对应的库，再带着版本和具体问题去查，拿到相关片段和原文地址。

比如刚才的 Zod，这次实际查询时，先用 resolve-library-id 找到了 /colinhacks/zod，结果里列出了可查询的版本。接着指定 /colinhacks/zod/v4.0.1，问它这两个旧参数该怎么迁移。

返回的内容就包含了新旧写法的对照，以及 Zod 仓库里对应版本的文档链接。按里面的写法，字符串校验可以这样改：

z.string({
  error: (issue) =>
    issue.input === undefined ? "这个字段不能为空" : "请输入字符串"
});

这里用 4.0.1 演示版本查询，大家操作时以自己项目实际安装的版本为准。这一次能确认的是，它查到了这个版本下相关的迁移说明；具体改完能不能跑，还得回到项目里验证。

先说怎么接。以 Codex 为例，有 Node.js 22.13 或更新版本的环境，在终端执行：

npx ctx7 setup --codex

按提示登录 Context7，再选择 CLI 或 MCP 接入方式。CLI 是让 AI 通过终端查询，MCP 是把查询功能接成 AI 可以直接调用的工具，先选一种就行。

如果你经常接触不熟悉的库，或者手里的几个项目用着不同版本，可以试试这个。

03：Superpowers：让 AI 按流程把功能做完

让 AI 改一个按钮的颜色，通常不难。

但如果需求变成了“给后台加一个批量导入用户的功能”，要考虑的事情就多了。

比如：重复用户跳过还是覆盖？一百条里面有三条错误，是全部失败，还是先导入剩下的九十七条？

这些规则没说清楚，AI 就可能按自己的理解补上。等代码写完，你再告诉它“这个地方我想的不是这样”，前面做的东西可能又得改一遍。

Superpowers 给它补的，就是一套从讨论需求到检查交付的开发流程。

它把不同阶段的做法整理成一组 Skills，让 AI 先确认要做什么，再拆任务、写测试、实现功能，最后进行代码评审。

看看官方列出的流程：

这里面有一个比较有用的要求，叫 TDD，也就是测试驱动开发。他的意思是：先写测试，看到测试因为功能还没实现而失败，再补代码，让测试通过。

拿刚才的批量导入来说，假设咱们已经确定“正确数据正常导入，错误行单独列出来”。那么测试里就应该放一份好坏数据混在一起的样例，检查成功数量、失败数量，以及具体哪几行出了错。

这样，前面讨论的业务规则，后面就有东西可以检查了。上传按钮能点、页面没有报错，只能说明这段流程走通了，还不能说明导入结果符合要求。

Codex 本身也有计划模式。Superpowers 多做的这一层，是把确认后的要求继续带到任务、测试和评审里，不用每次再从头交代整套做法。

安装也比较直接。

以 Codex 桌面版为例，打开侧边栏的 Plugins，在 Coding 分类里找到 Superpowers，点旁边的 +，按提示添加就可以了。

如果用的是 Codex CLI，就在会话里输入 /plugins，搜索 superpowers，选择 Install Plugin。

如果你经常让 AI 连续完成几个步骤、几条业务规则，可以试试这个 plugin。

04：Serena：让 AI 找准要改的代码

项目小的时候，让 AI 搜一下函数名，基本就能找到要改的地方。

但项目大了以后，同一个名字可能到处都是。比如 getUser，搜索结果出来一大串，得先分清楚：咱们要改的到底是哪一个？

我们自己在编辑器里处理这个问题，一般会用跳转到定义或者查找引用。点中一个方法，就能看看它定义在哪，哪些地方用到了它。

Serena 可以把这类代码分析能力接给 AI。它通过语言服务器等后端识别函数、类这些代码对象，再提供查询和修改工具。

文档里把这些对象叫“符号”。意思就是，两个类里都可以有一个 getUser，名字一样，但它们各自有定义、各自有调用位置，不能看到名字相同就一起改。

下面这张官方工具清单里，find_symbol 用来找定义，find_referencing_symbols 用来找引用它的代码，replace_symbol_body 则可以替换某个函数或类的完整定义。

比如，准备给 UserRepository 里的 getUser 增加一个租户参数，就可以先让它定位这个方法，再沿着引用找需要跟着修改的位置。

Serena 可以直接使用 uv 管理安装，大家需要先装好 uv。然后在终端依次执行：

uv tool install -p 3.13 serena-agent
serena init
serena setup codex

第一句安装 Serena，第二句按默认的语言服务器方式初始化，第三句配置它与 Codex 的连接。这是当前官方的安装和接入方式。

接好以后，新开一个 Codex 对话，先让它用 Serena 激活当前项目。用 CLI 的同学，也可以输入 /mcp 检查连接状态。桌面版尤其要确认激活的是你正在修改的项目。

如果你在维护一个文件比较多、调用关系比较绕的老项目，而 AI 还主要靠搜名字翻文件，可以看看这个。

05：security-audit-skill：让 AI 帮你处理安全问题

项目写完，准备给别人用了，很多同学会再补一句：“帮我看看有没有安全问题。”

AI 很快回你一份报告，列了几个“高危漏洞”。看起来挺吓人，但你顺着代码找过去，可能发现它说漏了一件事：这个接口前面，其实还有一层权限检查。

这时候，光把“疑似有问题”的地方列出来，还不够。得继续查，这条请求到底能不能走到那里，用户是不是真的能拿到不属于自己的数据。

Cloudflare 开源的 security-audit-skill，就把这段过程做成了一套安全审计流程。

它会先梳理项目结构和检查范围，再分配 Agent 去找疑点。找到以后，交给另一个独立的 Agent 复核，并要求它尝试推翻前面的判断。官方流程里，发现问题、验证问题和整理报告是分开的：

比如，假设 AI 发现订单查询接口直接用了传进来的订单 ID，怀疑这里有越权。

复核时就要继续看：前面的鉴权做了什么？查询条件里有没有当前用户？如果用 A 用户的身份请求 B 用户的订单，实际会发生什么？

因此，最后的记录会分成三类：

• confirmed：有完整的代码路径和可核对的结果，确认问题成立。
• needs_validation：有具体疑点，但仍缺少关键事实，需要继续验证。
• rejected：经过检查，这条疑点已经被排除。

这样读报告的时候，你能知道哪些需要修，哪些还要补材料，不用把所有“可能有问题”都当成已经发现的漏洞。

咱们可以直接在项目根目录执行：

npx skills add https://github.com/cloudflare/security-audit-skill \
  --skill security-audit

按提示选择使用的编程助手和安装范围。第一次用，可以先装到当前项目里面，感觉有帮助再装全局就行。

总结

五个工具，各管一段。

Impeccable 管页面好不好看，Context7 管 API 写得对不对，Superpowers 管做出来的是不是你要的那个东西，Serena 管改的地方找得准不准，security-audit 管有没有留下坑。

• 页面被自己嫌弃，就安装 Impeccable
• 老是撞上版本不一致的问题，就安装 Context7
• 需求一说就歪，返工返到崩，就安装 Superpowers
• 老项目不敢下手，就安装 Serena
• 快上线了心里没底，就安装 security-audit

同时，大家也可以回头想想自己手上的项目：有没有哪一步是你每次用着都不爽的。

如果有，那么大概率已经有人写好对应的工具了，去 GitHub 上翻翻就行。

要是翻不到，那就是最值得你自己动手做一个的时候！