Cursor Composer

在cursor的chat页面右侧,有个composer组件:

image-20241224195333541

它允许开发人员提供高级指令,用于创建整个应用程序或进行复杂的多文件更改。AI 会解释这些指令并生成或修改必要的文件和代码。

Composer和chat的最重要区别,Composer关注整个项目级别,强化了多文件理解与生成的能力

Cursor Composer 的主要功能包括:

  • 多文件编辑:通过一次操作创建或修改多个文件
  • 完整应用生成:根据高级指令生成整个应用
  • 上下文理解:AI 会考虑整个项目结构和现有代码

使用composer的快捷键是Command + I

示例

上一节我们最终的page.tsx, 它的代码有200多行,将很多函数和功能放在一起了,我们使用composer对它进行重构下:

image-20241224200908529

输入重构的指令:

image-20241224201255668

Composer会自动将它拆成多个文件,并创建好目录。点击Accept all

image-20241224201323872

测试改动代码后的页面,确认所有功能正常:

image-20241224201446558