Cursor Rules & Cursor MCP

Compoder Cli 支持生成和更新 Cursor Rules

核心是将 Compoder 内部生成组件代码的工作流（设计组件 => 实现组件），转换为通过 Cursor rules 实现。

prompt：

帮我在 compoder cli @cli/ 中添加一个命令，compoder ini，这个命令会做如下事情：

- 在执行命令的目录下提示用户选择要初始化的 codegen list（list 数据需要调用 app/api/codegen/mcp/codegen-list 来获取），同时提示用户可以按键盘上下进行选择切换，也可以输入文字根据 codegen 的名字进行过滤，切换到想要的 codegen 即可按回车进行选中确认。

- 当选中了某一个 codegen 之后，下一步提示用户选择某一个 ai 客户端，当前包含两个选项：1. Cursor；2. Claude Code。同时提示用户可以选择多个客户端进行初始化，用户可以上下切换不同的 ai client，按空格键来选择和取消选择当前 ai client，最后可以按回车确认。

- 当以上两个操作用户执行完成了之后，意味着用户提供的信息都收集完毕，compoder cli 内部需要做的事情：

1、在 cli 运行的根目录下生成一份 .compoderrc 文件，配置文件中包含刚刚用户选择的 codegen、选择的客户端（可能包含多个）

2、如果用户选择的 ai client 中包含了 cursor，则在 cli 运行的根目录.cursor/rules/compoder/下新建一个文件夹，比如当用户选择的 codegen 是 Landing Page Codegen，则新建一个.cursor/rules/compoder/landing-page-codegen 的文件夹出来，在文件夹的内部包含 3 个文件，第一个是入口文件 index.mdc，index.mdc 的内容参考@StorybookGenerationOrchestrator.mdc 所示，主要是告诉 ai 按照步骤来读取接下来要读取和执行的 2 个规则 md 文件（设计组件和实现组件）。第二个文件是 step1.md，这个 md 的内容主要就是@utils.ts 中的 buildSystemPrompt 相关的提示词，目的是为了设计组件，比如组件名字、描述、组件所依赖的组件，其中 componentsDescription 如果涉及到获取 private-components ，则调用 compoder 的 mcp server 来获取，比如获取 Landing Page Codegen，则按照@test-mcp-server.js 中的 testComponentList 方式来获取。第三个文件是 step2.md，这个 md 的主要内容就是@utils.ts 中 buildSystemPrompt 相关的提示词，其中 outputSpecification、styleSpecification 需要从数据库中获取，openSourceComponents 和 privateComponents 则从 step1.md 执行之后分析出来所依赖的组件来获取，根据所需要的组件，调用 compoder 的 mcp server 来获取，参考例子如@test-mcp-server.js 中的 testComponentDetail 所示。

3、如果用户选择的 ai client 中包含了 Claude Code，暂时先占位一个 TODO。

prompt

帮我在@cli/ 中增加一个 compoder update 的命令，我希望用户在执行 compoder update 的时候，可以先检测执行命令的根目录下是否存在.compoderrc 配置文件，如果存在的话，则读取文件的内容，根据文件中定义好的 codegen 和 aiClients 来更新规则文件

Compoder Cli 支持生成和更新 Cursor MCP 配置

prompt：

我希望在 @cli/ 的 compoder init 和 compoder update 执行的时候，还帮我生成 & 更新对应 ai client 的 mcp 配置文件：

- 当 ai client 包含 cursor 的时候，我希望在执行 compoder 命令的根目录下生成一个.cursor/mcp.json 文件，内容请参考如/Users/lv/workspace/codebase/compoder/artifacts/page-ui-renderer/.cursor/mcp.json 所示

- 当 ai client 包含 claude code 的时候，我希望暂时占位 TODO

案例： 在 Cursor 中使用 Compoder Landing Page Codegen

详见视频课程