1. 首页首页
  2. 科技前沿科技前沿

关于Cursor使用的小白第一视角

科技前沿 • • 阅读 1

关于Cursor使用的小白第一视角最近看破局感觉洋哥总是提到 cursor 感觉好火 所以打算学习一下怎么用 Cursor 如果可以希望能做一个我自己的网站 之前从来没用过 Cursor 所以 这是一篇小白视角的 Cursor 使用教程 如果你也是一个小白 并且对 Cursor 感兴趣 那么就进来看看吧 首先找到 Cursor 的下载入口 https changelog cursor sh 这里参考了圈友小潘

大家好，我是讯享网，很高兴认识大家。这里提供最前沿的Ai技术和互联网信息。



最近看破局感觉洋哥总是提到cursor，感觉好火，所以打算学习一下怎么用Cursor，如果可以希望能做一个我自己的网站。

之前从来没用过Cursor。所以，这是一篇小白视角的Cursor使用教程。

如果你也是一个小白，并且对Cursor感兴趣，那么就进来看看吧。

首先找到Cursor的下载入口：https://changelog.cursor.sh/

在这里插入图片描述 在这里插入图片描述

在这里插入图片描述

我用的谷歌账号（需要魔法），完美登录Cursor。

在这里插入图片描述 在这里插入图片描述

在这里插入图片描述

PS：官方文档界面是全英文的，不懂也没关系，下载个“沉浸式翻译：双语对照网页翻译&pdf文档翻译”的英翻中的插件就好啦

在这里插入图片描述

当然参考的还是小潘老师的帖子：https://t.zsxq.com/5GtKY

(这一章大致预览一下就好，工具只有多使用才能熟悉)

一些信息需要知道：cursor是收费的，但注册后14天可以免费试用
在这里插入图片描述

登陆好之后看到的是这样的

在这里插入图片描述

然后到Cursor里随便逛逛，在getting_started.md里看到了简单的介绍，还看到了cursor的官方网址，复制到浏览器打开，收藏，一气呵成

在这里插入图片描述

注意，官方网站是英文的，不过没关系，我上面提到的那个翻译插件，可以自动翻译出中文

在这里插入图片描述

简单来说，这个功能可以自动填充代码，你的光标停留在哪，Cursor会自动建议一些代码，你按下“Tab”键，代表你同意这些代码加入，它就会自动把显示的代码填入。

当然，并不是所有情况Cursor都会给出建议，官网上有个论坛讨论的部分，可以提交自己使用Cursor时，出现的异常情况

1、Tab功能打开和关闭入口：页面右下角的“光标选项卡”
在这里插入图片描述
2、把Tab的功能梳理出来：
①生成代码：从光标所在的地方给出建议添加的代码
②多行编辑：一次性可以修改好几行，而不是仅限于光标在的那行
③智能重写：可以根据你最近的更新和报错，提出一些建议
④光标预测：自动预测下一个光标所放的位置，可以引导你写代码
















这里，试用版和付费版有一些区别：免费版可以获得2000条建议，付费版（Pro和Business 建议次数不受限制）

3、Tab（Cursor预测功能）的显示主要有两种
①灰色的代码，表示所预测的接下来的代码，按下“Tab”键，这些代码就真正显示到你的这一行了
在这里插入图片描述
②当你写的有问题想要修改更新代码时，Cursor发现了你的问题，并且给出建议的代码，是用一个弹窗表示的
在这里插入图片描述在这里插入图片描述










4、同意和拒绝加入预测的代码：
①按下“Tab”键表示同意，按下“Esc”表示拒绝
②只想同意一部分代码，按 “Ctrl” + “→”




那么对于Cursor Tab（我理解成代码预测功能）部分的初步了解和摸索就到这啦，再让我看看下一个

简单来说，就是用语言模型（ChatGPT 4.0这种）帮你生成代码，还不用自己复制粘贴，你觉得代码生成的还可以，就让Cursor直接帮你放文件里。

1、打开和关闭Chat功能：按下Ctrl + L
在这里插入图片描述

2、把Chat的功能梳理一下：

①按下“Ctrl”+“Enter” ,输入关键词，就可以从自己的代码库里查询到相关的代码

②输入“@”就可以引用文件夹中所有文件和代码符号

③可以使用图片，点击“Image”功能，或者把图片拖入输入框，图片内容也可以加入上下文

④输入“@Web” 大模型就可以上网给你搜索最新的信息来回答你的问题

⑤点击Chat功能框上的“Play”按钮，Chat给出的建议代码就直接加到你的代码里啦

⑥输入“@LibraryName”，可以引用常见的库，使用“@Docs”可以把新文档添加到自己的项目里

3、一些相关的概念：

①User Message(用户消息)：包含输入的文本以及引用的上下文。可以退回到任何以前的用户消息来编辑和重新运行查询。

②AI Message(AI消息)：大模型生成的那些消息，可能包含预测的代码，可以直接添加到自己的代码库里。

③Chat History(Chat里的历史消息)：按下“Ctrl+Alt+L”，显示历史消息

④Chat默认会根据上下文推论，如果你想关闭，按下“Alt+Enter”来提交不包含上下文的查询

简单来说，就是可以在代码编辑窗口生成新的代码或者，编辑现在有的代码。

打开Cmd K 功能：按下“Ctrl+K”，输入描述，点击esc接受命令，点击“Ctrl+Enter”立即执行

把Ctrl K的功能梳理一下：

①快速编辑：选择一些代码后，描述需求，使用AI修改或重新写代码

②快速提问：如果你对哪部分代码有问题，选择那段代码并且点击“quick question”，

大致了解Cursor里有啥之后，开始试玩一下Cursor。

在拓展里搜索“Chinese”，会出现一个标了“中文（简体）”的插件，安装后点击左下角确认切换语言，软件就会重启，然后就成中文版的啦。

在这里插入图片描述

使用Composer可以直接进行文件级的操作，例如创建、修改、删除操作

刚打开的时候，会默认一个案例和一个项目的文件夹，里面都是对Cursor的说明。可以选择“文件”→“打开文件夹”→选择了一个地方后新创建一个文件夹→确认选择

在这里插入图片描述 在这里插入图片描述

@参考的up主花生的视频

简单总结：到Composer里发了一段需求，到Chrome浏览器里安装了插件，创建了QRcode.min.js的文件并把代码粘进去，遇到了报错告诉Composer，刷新插件，功能完成√

图文步骤：

1、“Ctrl”+"i"打开Composer
2、输入制作网页二维码的要求
在这里插入图片描述




 
  
 
   
3、回车，Cursor开始生成代码和文件
 
  
 
  
在这里插入图片描述
 
  
 
   
4、Composer创建了一些代码文件，还给出了几条操作步骤，一步一步地去操作。记得选“Accept all”接受所有的代码建议
 
  
 
  
在这里插入图片描述
 
  
 
   
5、插件效果没出来，它让我添加一个QR库，我直接问他：“插件失败了，怎么添加QR库呢”
 
  
 
  
在这里插入图片描述
 
  
 
   
6、继续按步骤做，操作完就按“Accept all”，然后到Chrome 浏览器刷新插件，再试一下。这个时候，二维码就出来了
 
  
 
  
 
   在这里插入图片描述 在这里插入图片描述 
  
 
  
 
   
7、如果你之后试还是出错，就告诉他说插件出错了，他就会继续修改，一次次刷新测试，几次之后效果就修正好啦
 
  
 
  
优化：
 
  
虽然挺满意了，但还可以优化一下，输入：
 
  
 
  
最终效果：
 
  
 
   在这里插入图片描述 在这里插入图片描述 
  
 
  
确保Composer打开了，新创建一个文件夹
 
  
 
   
简单来说：到Composer里发了一段需求，跟着Composer的要求操作，到Chrome浏览器里安装了插件，遇到了报错告诉Composer，刷新插件，测试，功能完成√
 
  
 
  
图文步骤：
 
  
 
   
1、按“Ctrl”+“i”，打开Composer
 2、到Composer输入框输入以下插件需求：
 在这里插入图片描述




 
  
 
  
 
  
 
   
3、回车，Cursor开始生成代码和文件。Composer创建了一些代码文件，还给出了几条操作步骤，一步一步地去操作。记得选“Accept all”接受所有的代码建议
 
  
 
  
在这里插入图片描述
 
  
 
   
4、尝试加载插件，失败。那么继续在Composer里告诉他，还是不行，就把显示的错误原因直接复制粘贴发给他。它生成完之后我点击“Accept all”，接受他所有的代码建议。
 
  
 
  
 
  
 
   在这里插入图片描述 在这里插入图片描述 
  
 
  
 
   
5、然后重新加载插件，刷新插件
 
  
 
  
 
   在这里插入图片描述 在这里插入图片描述 
  
 
  
 
   
6、随便打开一个英文网站（Cursor官方文档：https://docs.cursor.com/chat/overview），选中一段英文
 
  
 
  
在这里插入图片描述
 
  
效果：
 在这里插入图片描述

 
  
 
   
7、如果你之后试还是出错，就把报错信息发给他，他就会继续修改，一次次刷新测试后，插件就修正好啦
 
  
 
  
1、新创建一个文件夹，按“Ctrl”+“i”，打开Composer
 2、到Composer输入框输入以下需求

 
  
 
  
在这里插入图片描述
 
  
3、Composer提示我要下载一个Python库，增加一个小图标，照着步骤执行
 推荐一个下载小图标的网站（iconfont阿里巴巴矢量图标库）：https://www.iconfont.cn/

 
  
（记得按“Accept all”保存生成的代码）
 
  
不知道怎么下载Python库，问一问Composer：
 
  
 
  
在这里插入图片描述
 
  
 
   
按windows+R，输入cmd，再输入Pygame库下载的代码，按回车，开始下载
 
  
 
  
在这里插入图片描述
 
  
4、运行代码，看看效果
 
  
最终效果：
 
  
按任意↑↓←→箭头，绿色的“贪吃蛇”就开始动啦，每吃下一个“红苹果”，贪吃蛇就会加长一截
 
  
 
   在这里插入图片描述 在这里插入图片描述 
  
 
  
1、打开Composer，输入网页要求
 
  
 
  
 
   
一个简单的网页就出来了，继续提需求…
 
  
 
  
 
   在这里插入图片描述 在这里插入图片描述 
  
 
  
2、源源不断提需求
 
  
输入：
 
  
 
  
在这里插入图片描述
 
  
看到主内容部分有个“阅读全文”，但我点击没有任何反应，所以又提需求：
 
  
 
  
看久了感觉左边自我介绍部分侧边栏太宽了，调整一下：
 
  
 
  
继续输入中文提需求…
 
  
3、增加写文章的功能
 
  
 
  
 
   在这里插入图片描述 在这里插入图片描述 
  
 
  
Markdown的功能能实现了，但我想要更方便一点，增加一些快捷功能键
 
  
 
  
在这里插入图片描述
 
  
现在两个网页是独立的，我希望这俩页面可以交互，继续提需求
 
  
 
  
 
   在这里插入图片描述 在这里插入图片描述 
  
 
  
 
  
继续输入
 
  
 
  
在这里插入图片描述
 
  
先展示这么多步骤，之后就是一直提需求优化…
 
  
在这里插入图片描述
 
  
 
   
多说一句：如果想要自己的网站能够被别人搜到，得配置云服务器、数据库之类的，该学的还得学。Cursor只是方便你写代码。
 
  
 
  
 
   
继续【案例三：个人博客网页】，想在网页上增加一个AI对话的功能。
 
   
1、先实现网页里对话框的样子
 
   
 
   
Composer也有告诉我“这只是一个基本界面，但AI对话的功能还没有实现，需要API”
 
   
 
    在这里插入图片描述 在这里插入图片描述 
   
 
   
2、去申请个API
 
   
编程小知识：API指的是“应用程序编程接口”，可以理解成别人把复杂的功能写出来打包好了，你只需要使用链接，传入相关的信息，就可以直接得到处理好的回复结果。
 
   
先去申请个API，从浏览器打开网页 https://platform.moonshot.cn/console/api-keys
 
   
在这里插入图片描述
 
   
 
    
扫码登录/注册后，点击“API Key管理”，新建一个Key
 
   
 
   
在这里插入图片描述
 
   
 
    
然后创建后获得了一个密钥Key，点击“复制”保存好。
 
   
 
   
在这里插入图片描述
 
   
 
    
3、把自己获得的API和Key告诉Cursor
 
   
 
   
 
   
在这里插入图片描述
 
   
 
    
Cursor把代码生成完之后，刷新网页，然后测试一下
 
   
 
   
在这里插入图片描述
 
   
4、优化
 
   
测试过程中发现，他自称Kimi，并且问问题后，是生成完整回答后一次性显示一大段，我想要增强一点交互感。
 
   
改：
 
   
 
   
 
    在这里插入图片描述 在这里插入图片描述 
   
 
   
继续输入：
 
   
 
   
在这里插入图片描述
 
   
 
   
1、新创建一个文件夹，按“Ctrl”+“i”，打开Composer
 
   
2、到Composer输入框输入以下需求
 
   
 
   
3、照着提示的步骤做下载两个小图标放到文件夹里，命名好
 
   
可以免费下载小图标的网站：https://www.iconfont.cn/#weibo_redirect
 
   
 
    在这里插入图片描述 在这里插入图片描述 
   
 
   
用一个视频网站测试，看到了一个视频下载小图标，点击下载，却出错了
 
   
 
    在这里插入图片描述 在这里插入图片描述 
   
 
   
4、把问题告诉Composer，尝试了很多很多次还是无法解决下载网页视频的问题
 
   
在这里插入图片描述
 
   
5、放弃，换一个案例尝试
 
   
如果有能实现的朋友，欢迎一起交流~
 
   
 
  
  

                    


                    


                    

                        

                            

                                小讯
                            

                            

                                

                                    
                                        
                                    
                                

                            

                        

                    

                


                

                    
                    
                    

                        
                        

                             上一篇
                            2026-04-05 20:12
                        

                    

                    
                    


                    
                    
                    

                        
                        

                            下一篇 
                            2026-04-05 20:10
                        

                    

                    
                    
                


                

                    
相关推荐

                    
                

                

                    

                        版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/221467.html