Cursor 自动化批量修改大量代码场景

背景

使用 Cursor 写代码容易、但是想写好代码很难、本文主要探讨在大量批量化修改文件时、如何使用 Cursor 更加高效。在相同的场景中、你也可以复用这个方案。

在我的本次案例中、我需要在：

React 项目中对按钮进行可读、可写的权限改造
Vue2 项目部分页面按钮进行可读、可写的权限改造

在 React 项目中 Button 按钮涉及到 89 个文件、207 个结果、还需要对 a、div、icon、confrom 组件进行改造，也涉及到 135 个 click 事件、需要转换的文件 100+

在 Vue 中、主要包含 11 个路由页面、但是路由页面也存在很多子组件的嵌套、涉及到的文件也有 50+

利用 Cursor 的 Ai 改造、从原本的一周高强度工作量、减少到了两天、并且覆盖率高达 95%

内容检索

在第一次中、我尝试直接使用 Cursor 对话、来批量修改、但是在修改的途中、我发现 Cursor 不能精确的定位所有文件、并且在处理大量的文件时、他喜欢采用 快速处理、这就导致了很多内容并不能精准的修改。

为了精准的修改、首先你需要知道有那些文件、那些部分需要改造、那我首先想到的就是 IDE 自带的搜索功能：

对项目中的 Button 组件进行精准化搜索、你可以直接得到这些的相关信息、并把这些内容拷贝到临时文件中，来作为需要让 Cursor 改造的前提。

可以看到、这些文件内容 Cursor 也是能识别的、如果在你的项目中、你没有其他的特殊情况，比如有些情况下、div、Icon 组件都存在点击事件。

这种情况下使用 IDE 自带的搜索、已经不能满足了、直接使用 AI 搜索：

css 复制代码

我需要在我的项目中对每一个按钮或者包含点击事件的都添加权限。
- 你需要检索我目录中的所有文件、并使用 txt 的形式对文件一一列出
- 这些点击事情可能来自于 button、也有可能是其他的标签、例如：a、Icon、Popconfrim
- 当检索完毕后、我需要例对存在的 click 事件总数、文件总数汇总

这是我按照之前处理的方式、回顾的提示词、大体意思差不多、就是汇总文件、列出文件列表、效果如下：

这些内容都是我处理后的、如果只是第一次检索、应该只有文件列表、并没有状态。

同理、对部分的页面、你只需要告诉他有哪些页面组件：

Vue2 的我只有部分页面、并没有全部、同样采用上面的处理逻辑、列出文件。

不过需要注意的是，我们只知道有那些页面、而不是全部组件、所以你需要告诉他：

复制代码

你需要注意：你提供给你的这些页面组件、还可能嵌套另外的组件、这些都需要一一列出

批量修改

后续就需要进行批量化修改了、最好把修改的规则也添加到文件中、当使用的 Agent 上下文记忆溢出时、可以无缝切换：

把这些文件丢给 Cursor、并告诉他：

diff 复制代码

现在我需要对这些文件都添加按钮权限
- 你不需要处理 eslint 错误、只处理权限相关的问题
- 你的处理顺序需要按照文件顺序一一处理
- 当处理完一个文件后、你需要立即列举出你的修改内容并添加修改状态、以方便我去审阅

通过这种方案、Cursor 知道了修改访问、并且当文件修改完毕时、我也可用通过主文件来知道它修改了那些内容、并且还能检测修改进度。

同时这个文件还可以作为记忆文件、当上下文快超出时、这个文件可以无缝使用。

总结

在本文中、我们主要探讨了如何让 Cursor 精准批量修改文件、防止修改的内部不准确、文件覆盖不全

主要步骤就是：生成内容检索文件 => 通过文件批量修改

这种思路同样适用于其他场景，例如在功能开发中、你可以让 Cursor 提示规划详细的实现步骤，并以步骤来作为指标一一实现。