动手学 cursor ：AI 辅助编程伴侣（附谷歌翻译插件制作）

16 阅读 0 评论 0 点赞

大家好，我是 Q1Hang，致力于探索 AI 赋能的 00 后大四学生。

作者之前也尝试过一些 AI 编码工具，如通义灵码、AWS。但对不懂代码的小伙伴进行开发还是有些困难，作者主要用这两款工具进行代码解释，编写一些简单的代码。

AI 发展的速度真的远超我们的想象，当我上手 cursor 这一款编码软件，它生成的效率和结果让我直呼 “WOC”，只需要简单的输入我的需求，cursor 便自动帮我生成一个包含完整目录结构和代码的项目。

这让不懂代码的小伙伴也能轻松开发简单的谷歌插件和小项目；对于懂代码的小伙伴，Cursor 则大幅提升了编码效率，使得让所有人都能编码成为了可能。

接下来，我们就一起来上手这一款 AI 编程软件吧，0 基础也能做一个简单的谷歌翻译小插件！！！

Cursor 下载地址：https://www.cursor.com/

官方文档：https://docs.cursor.com/get-started/migrate-from-vscode

效果展示：

英译中

在这里插入图片描述

中译英

在这里插入图片描述

一、Cursor 注册

在这里插入图片描述

cursor 支持谷歌邮箱和 github 一键登录，如果你没有这些账号也没关系，选择注册（这一步需要魔法）

在这里插入图片描述

可以选择国内邮箱进行注册

在这里插入图片描述

登陆成功界面，新注册的用户有 14 天付费订阅资格，可以调用 500 次高级大模型（Claude、4o）

在这里插入图片描述

cursor app 主界面登录

在这里插入图片描述

也可以在设置中登录

在这里插入图片描述

这一步会跳转到网页进行登录

在这里插入图片描述

二、Cursor 基础配置

如果有用过 VSCode 的小伙伴，是不是对这个界面非常熟悉，我们也可以直接将 VSCode 中的配置导入进来

在这里插入图片描述

中文插件安装

在插件商店输入 Chinese 下载中文插件，左下角切换语言并重启

在这里插入图片描述

快捷键预览

在这里插入图片描述

不过最常用，以及最具 Cursor 特色的是下面这几个快捷键

Tab，自动代码补全

Ctrl+K，选择某一段代码，根据指示进行修改

在这里插入图片描述

Ctrl+L，指定代码文件或者一段代码进行对话，可以询问代码细节

在这里插入图片描述

composer（全局对话）

composer 是 Cursor最惊艳的功能之一，它允许我们直接进行文件级的操作。例如，我们可以直接生成整个项目的结构，或者修改项目内所有文件的代码。

Ctrl+I ，composer 需要提前在设置页面打开

在这里插入图片描述

三、实战案例

我们实现的是一个划词翻译的功能，提供一个复制按钮，该翻译功能可以选择开启或者关闭。

操作步骤

1、创建一个项目文件夹

在这里插入图片描述

2、Ctrl+I 进入 composer 功能，输入下面的提示词

帮我实现一个 Chrome 插件，要求的功能如下：
1、选中文本就能将识别语言并将全部文本进行谷歌翻译（中译英、英译中）
2、翻译结果显示在文字旁边
3、弹出的翻译窗口可以自由拖动，并提供一个复制按钮
4、在网页右下角添加一个开关能控制这个功能是否启用
5、无需使用图标
6、使用V3版本的manifest.json
7、请注意中文的格式编码问题

3、Accept all 接受所有更改

在这里插入图片描述