Cursor：一个集成 GPT-4 的 IDE 开发工具

2023.3.19
版权声明：本文为博主chszs的原创文章，未经博主允许不得转载。

一、简介

官网：https://www.cursor.so/

cursor.so 是一个适合程序员编码的，且集成了 GPT-4 的免费 IDE 工具（目前免费），可以帮助用户快速编写、编辑和优化代码。

cursor.so 支持主流的编程语言，并且可以根据用户的输入描述自动生成满足需求的代码片段。

cursor.so 还可以帮助用户优化和重构代码，或者为陌生的代码添加注释以帮助理解代码，提高开发效率。

总而言之，这是一款革命性的编码 IDE 工具，目前官网提供了 Windows、Linux 和 macOS 三个版本的发行版。

从官网下载发行版时，可以看到目前的最新版本为 0.1.3版，说明它还处于幼苗期，但因为有了 GPT-4 的加持，打破了传统 IDE 开发工具的桎梏。

二、下载、安装和初步使用

Windows 版的下载地址为：https://dl.todesktop.com/230313mzl4w4u92/windows/nsis/x64，下载后得到 Cursor Setup 0.1.3-x64.exe 文件，约 85MB。

安装很不友好，没有提供任何选择，直接默认安装到“C:\Users\chszs\AppData\Local\Programs\Cursor”。

安装完成后直接运行，可以看到界面如下：

可以看到，cursor 为 Vim 程序员和 Emacs 程序员提供了熟悉的热键绑定，其他用户可以选择 Default（默认）。

还可以连接到 Github 的 Copilot，这是针对已经交过 Copilot 订阅费的程序员。由于 cursor 内部整合了 GPT-4，因此不连接也无所谓。

点击 continue 按钮就进入了开发主界面。

内容为：

// 欢迎访问 Cursor

// 1. 尝试在新行上使用命令 K 生成。请求一个弹出错误提示的新 React 组件。
// 2. 然后，选择输出的代码并点击 chat。询问是否有bug，询问如何改进。
// 3. 试着选择一些代码并点击 edit，让机器人添加一个更新状态字段的按钮。
// 4. 要在自己的项目上尝试 Cursor，请转到菜单 file（左上角）并打开一个文件夹。

我按下 Ctrl+K，然后它根据注释自动生成代码：

扫描二维码关注公众号，回复： 15211124 查看本文章

function ErrorPopup() {
    
    
  const [errorMessage, setErrorMessage] = useState("");

  const handleButtonClick = () => {
    
    
    setErrorMessage("New error message");
  };

  return (
    <div>
      <h1>Error Popup</h1>
      <p>{
    
    errorMessage}</p>
      <button onClick={
    
    handleButtonClick}>Update Error Message</button>
    </div>
  );
}

我选中生成的代码，按下 Ctrl+L，如下：
代码生成
接着我询问“这段代码是否有bug，如何改进它”，并回车：
与bot对话
机器人的答复如下：
bot回答
大意是：

所选代码没有任何语法错误或错误，但可以对代码进行一些改进。
首先，使用默认值初始化errorMessage状态是一个很好的实践。这可以通过将默认值作为参数传递给useState钩子来实现。
- const [errorMessage, setErrorMessage] = useState(“Default error message”);
其次，可以通过将新的错误消息作为参数传递给setErrorMessage函数来改进handleButtonClick函数。这确保即使状态更新是异步的，新的错误消息也被正确设置。例如：
- const handleButtonClick = () => { setErrorMessage(“New error message”); };
最后，建议使用useCallback钩子来记住handleButtonClick函数。这可以通过防止不必要的组件重新呈现来提高性能。
- const handleButtonClick = useCallback(() => { setErrorMessage(“New error message”); }, []);
下面是修改后的代码:

function ErrorPopup() {
    
    
  const [errorMessage, setErrorMessage] = useState("Default error message");

  const handleButtonClick = useCallback(() => {
    
    
    setErrorMessage("New error message");
  }, []);

  return (
    <div>
      <h1>Error Popup</h1>
      <p>{
    
    errorMessage}</p>
      <button onClick={
    
    handleButtonClick}>Update Error Message</button>
    </div>
  );
}

根据前面的提示，我点击 Edit，要求机器人“添加一个更新状态字段的按钮”。

机器人果然自动添加了代码，并询问我是接受这个改动，还是拒绝此改动。
接受或拒绝
我选择了接受。

以上步骤是官方提供的使用示例，自动生成 React 代码，可以看到功能确实很强大，后续我会将 Cursor 用于 Rust 开发。

三、正式使用

1、在 cursor IDE 中新建一个名为 readFileName.rs 的文件，然后在文件的第一行添加注释：

// 用Rust语言编写一个遍历指定目录的程序，输入为目录名，按行输出目录中的文件名

2、按下 Ctrl+K，让机器人自动生成 Rust 代码：
生成Rust代码

// 用Rust语言编写一个遍历指定目录的程序，输入为目录名，按行输出目录中的文件名
fn main() {
    
    
    let path = std::env::args().nth(1).expect("missing path argument");
    let dir = std::fs::read_dir(path).expect("failed to read directory");
    for entry in dir {
    
    
        let entry = entry.expect("failed to get entry");
        let file_name = entry.file_name();
        println!("{}", file_name.to_string_lossy());
    }
}

3、选中生成的代码，询问机器人代码是否有Bug，是否可以优化。
机器人答复

大意为：

这段代码看起来没有明显的 bug，但是可以做一些优化。
首先，我们可以使用 if let 语句来避免使用 expect 函数。expect 函数会在遇到错误时直接调用 panic! 宏，而 if let 语句可以让我们更好地处理错误。修改后的代码如下：

fn main() {
    
    
    let path = std::env::args().nth(1).expect("missing path argument");
    let dir = std::fs::read_dir(path);
    if let Ok(dir) = dir {
    
    
        for entry in dir {
    
    
            if let Ok(entry) = entry {
    
    
                let file_name = entry.file_name();
                println!("{}", file_name.to_string_lossy());
            }
        }
    }
}

其次，我们可以使用 map 函数来简化代码。map 函数可以将一个迭代器中的每个元素映射为另一个元素，然后返回一个新的迭代器。修改后的代码如下：

fn main() {
    
    
    let path = std::env::args().nth(1).expect("missing path argument");
    let dir = std::fs::read_dir(path);
    if let Ok(dir) = dir {
    
    
        dir.map(|entry| {
    
    
            if let Ok(entry) = entry {
    
    
                let file_name = entry.file_name();
                println!("{}", file_name.to_string_lossy());
            }
        }).for_each(drop);
    }
}

这里使用了 for_each 函数来遍历迭代器，drop 函数用于忽略 map 函数返回的新迭代器中的元素。

4、要求机器人为代码添加注释

选中这段 Rust 代码，按下 Ctrl+L，输入“为这段代码添加注释”，可以i看到：
机器人答复
5、编译代码并执行，工作正常。

总结

cursor 确实是一个革命性的工具，能极大地提升开发效率。
cursor 或者说 GPT-4 对于初级、中级程序员来说是降维打击，很容易替代。
可以预见，未来的一般项目开发，会演变成：

项目开发团队的构成成分会发生显著变化
只负责模块级开发的初/中级程序员的数量会大大减少
负责整体架构、全局优化、精通调试技术的架构师和资深程序员的需求会大大增加
负责对接甲方、梳理和精通业务的需求工程师会大大增加