❝上一篇“AI助力编程领域迅猛发展,从权威榜单看2025年代码生成能力哪家强~”提到AI编程IDE界的翘楚Cursor。
本篇实际体验一下如何使用Cursor、结合字节跳动Coze平台搭建的Agent开发一个简单的文生图微信小程序。
一起来感受AI给Coding带来的效率提升吧~
❞
1、Cursor下载/安装/注册
从Cursor官网(https://www.cursor.com/)下载安装程序后,如果正在使用windows,想安装至D盘(双击exe会默认C盘),Trick如下:
在PowerShell命令行中运行:cd <安装包文件夹>
继续运行以下命令即可,安装至D:\Cursor目录下:
Start-Process -FilePath ".\Cursor Setup 0.44.11 - Build 250103fqxdt5u9z-x64.exe" -ArgumentList /D="D:\Cursor" -Wait
在安装界面最后会引导跳转浏览器,完成用户注册。
新用户有2周免费的pro调用权限。可在淘宝低价购买or用网上分享的免费策略延长(删除账号、重新注册)。
2、微信开发者工具+Cursor代码生成与调试
(1)微信开发者工具创建新项目
(2)Cursor打开新项目文件夹: 使用快捷键 ctrl+i调出右侧composer(Cursor最核心功能),选择模型claude-3.5-sonnet。
-
主要快捷键:
任意界面下,ctrl+i,进入composer,修改代码,选择是否accept
在代码中,ctrl+k,聊天生成
在代码中,ctrl+L,进行聊天(带上上下文)
在chat面板中,Ctrl/⌘ + Enter,扫描索引代码库,包含进对话上下文
在chat面板中聊天时,开头@Codebase,会进行详细的搜索
-
在composer面板输入框中,输入以下文字需求描述:
1.你是一个经验丰富的微信小程序UI工程师,熟悉微信的UI设计,设计风格简约明朗
2.你将负责设计微信小程序的UI
3.你现在已经在微信小程序的项目中,不用帮我生成项目目录结构
4.我需要设计一个页面:页面有一个输入框,一个按钮
5.输入框中输入内容,点击按钮后,会调用coze的api,调用成功后,会返回一个图片的URL,将图片的URL显示在页面上
6.所有调整备注更新至readme.md
等待代码生成后,选择“Accept all”,即可接受所有代码的更新。
(3)微信开发者工具中完成代码编译,将编译告警文字直接复制粘贴至Cursor composer面板,Cursor会自动分析并更新代码。
(4)反复执行第3步,直到编译成功(不报错)即可
3、调用Coze服务接口
(1)在Cusor右侧的composer面板输入框中,输入以下文字需求描述:
参考https://www.coze.cn/docs/developer_guides/workflow_run,配置api接口,api会返回图片URL地址。
参考API 文档: curl --location --request POST 'https://api.coze.cn/v1/workflow/run' \ --header 'Authorization: Bearer pat_hfwkehfncaf****' \ --header 'Content-Type: application/json' \ --data-raw '{ "workflow_id": "73664689170551*****", "parameters": { "user_id":"12345", "user_name":"George" } }' { "code": 0, "cost": "0", "data": "{\"output\":\"北京的经度为116.4074°E,纬度为39.9042°N。\"}", "debug_url": "https://www.coze.cn/work_flow?execute_id=741364789030728****&space_id=736142423532160****&workflow_id=738958910358870****", "msg": "Success", "token": 98 }
等待代码生成并更新,需按模型返回的建议,完成一些参数的配置:
(2)浏览器进入Coze平台(https://www.coze.cn/home),搜索复制一个简易的文生图Agent,点进去就能在地址栏中看到workflow_id:
(3)打开Coze平台(https://www.coze.cn/open/oauth/pats),新建配置访问权限Authorization(PAT token):
(4)微信开发者工具中,左侧直接就能运行(先在右侧勾选不校验域名)。
小结
本地调试运行无误后,按照微信平台要求进行设置和审核,即可将小程序发布至微信平台供用户使用。
以上操作步骤,按提示改配置即可,基本不需要读代码。
本篇中的需求提示文本来自:
https://cloud.tencent.com/developer/article/2466006
需求描述越详细,Cursor实现效果越好。
最后,祝大家“新年好运”~
欢迎关注公众号“AI趣栈”,持续为您提供关于AI的好内容~