cursor对话关键词技巧

提示词基本结构与原则

一个好的 Cursor 提示词通常包含三个部分:目标说明 + 上下文信息 + 具体要求

例如:

复制代码
创建一个React登录组件,使用Tailwind CSS样式,需要包含邮箱验证功能和记住密码选项。

效果演示:

提示词的的黄金原则

  1. 具体胜于模糊:指定语言、框架和功能

  2. 简洁胜于冗长:每次聚焦一个明确任务

  3. 结构胜于无序:使用标记符号组织信息

5个实用的提示词模板

1. 代码生成模板

复制代码
用[编程语言]创建[功能描述],要求:
1. [功能要点1]
2. [功能要点2]
3. [功能要点3]
风格参考:[项目中已有的文件路径]

试一试:复制以下提示词到Cursor。

复制代码
用JSX创建一个立即注册页面,要求:
1. 使用 React Jsx 语法
2. 在登录页面点击立即注册之后可以跳转到该页面
3. 页面 UI 风格和登录页面保持一致
4. 预留 API 调用逻辑,便于后续实现
风格参考:项目中已有的 components/login.jsx

效果展示

在登录页面点击立即注册跳转到注册页面,同时还可以点击立即登录跳转回去。注册页面自动帮你生成元素:用户名、邮箱地址、密码、确认密码、服务条款和隐私政策。如果你觉得不符合你的预期,可以在功能点中具体要求。

2. 代码解释模板

复制代码
解释以下代码的功能和工作原理:
[粘贴需要解释的代码]
主要关注:
- [关注点1]
- [关注点2]

试一试:复制以下提示词。

复制代码
解释以下代码的功能和工作原理:
参考@引用的代码片段
主要关注:
- 邮箱和密码的校验逻辑
- 登录界面的样式设计

效果展示

3. 代码重构模板

复制代码
重构以下代码,提高其[性能/可读性/可维护性]:
[粘贴需要重构的代码]
重点改进:
1. [改进点1]
2. [改进点2]
但保持原有的功能不变

试一试:复制以下提示词。

复制代码
重构以下代码,提高页面的 UI 设计:
参考@引用的代码片段或者文件
重点改进:
1. 设计一个美观的背景图,采用渐变色
2. 登录界面加入一个平台名称,如:Eric技术圈,同时在这个名称前面生成一个图标
但保持原有的功能不变

效果展示

不仅帮你修改了登录页面,同时也将注册页面一起调整了背景色。

4. 调试辅助模板

复制代码
以下代码出现[错误描述]问题:
[粘贴有问题的代码]
错误信息:[粘贴错误信息]
我尝试过:[你已尝试的解决方案]
帮我找出问题并修复

因在使用的过程中并没有碰到错误,这里就不贴例子了,可自行尝试。

5. 功能扩展模板

复制代码
基于现有代码:
[粘贴现有代码]
添加[新功能描述]功能,需要与现有代码风格保持一致

试一试:复制以下提示词。

复制代码
基于现有代码:
参考@引用的文件
添加如下功能:
1. 该页面当前只支持邮箱地址登录,加上手机号码登录
2. 两种登录方式,可以快速切换
3. 手机号登录不需要密码,通过获取验证码登录
4. 手机号码需要进行校验,暂时支持+86中国区,11 位数字
需要与现有代码风格保持一致

效果演示

目前 AI 的能力已经很强了,以上的生成效果几乎都是一次性生成出来的,没有出现过错误。我将代码直接部署到了云服务器,大家可以直接体验。

源码:https://github.com/flyeric0212/react-login-demo\[1\]

网址:https://login-demo.flyeric.top/\[2\]

提示词错误案例

案例一:模糊提示词

优化前

复制代码
帮我写一个登录功能

AI 可能的回应生成一个基础但可能不符合项目需求的通用登录功能

优化后

复制代码
使用React和Formik创建登录组件,包含:
1. 邮箱和密码输入框(带验证)
2. 记住我选项
3. 提交按钮(带加载状态)
样式需使用项目现有的tailwind.css类,参考src/components/Button.js的风格

AI可能的回应生成符合项目具体技术栈和风格的完整登录组件

案例二:功能实现

优化前

复制代码
写个图片上传

优化后

复制代码
实现React图片上传组件,要求:
1. 支持拖放和点击选择
2. 预览功能
3. 文件大小限制(最大2MB)
4. 仅允许jpg/png格式
集成现有的API:uploadImageToServer(file)

常见错误与避免方法

错误类型 示例 改进方法
过于宽泛 写个好看的UI 使用Material UI创建数据表格,支持排序和分页
隐含假设 修复登录问题" 修复登录表单提交后出现的401错误,详细错误日志:...
术语混淆 做个响应式的程序 创建在移动端和桌面端都能良好显示的React组件
相关推荐
Jooolin3 小时前
【编程史】Git是如何诞生的?这可并非计划之中...
linux·git·ai编程
Jooolin5 小时前
【编程史】IDE 是谁发明的?从 punch cards 到 VS Code
ai编程·visual studio code·编译器
Lilith的AI学习日记6 小时前
什么是预训练?深入解读大模型AI的“高考集训”
开发语言·人工智能·深度学习·神经网络·机器学习·ai编程
程序员陆通6 小时前
Vibe Coding AI编程
ai编程
Jaising6666 小时前
JetBrains AI 打零工(一)——生产力工具与程序员的驾驭之道
ai编程·intellij idea
翔云1234568 小时前
2025年AI编程工具推荐
ai编程
用户28988180666429 小时前
如何定制个人智能体
ai编程·coze
SleepyZone10 小时前
Cline 源码浅析 - 从输入到输出
前端·ai编程·cline
鼓掌MVP10 小时前
AI编程漫谈:与数字智慧共舞的旅程
ai编程
OliverZ10 小时前
Cursor 1.0 更新摘要
ai编程·cursor