记录小白使用 Cursor 开发第一个微信小程序(二):创建项目、编译、预览、发布(250308)

ops/2025/3/14 5:50:38/

文章目录

  • 记录小白使用 Cursor 开发第一个小程序>微信小程序(二):创建项目、编译、预览、发布(250308)
    • 一、创建项目
      • 1.1 生成提示词
      • 1.2 生成代码
    • 二、编译预览
      • 2.1 导入项目
      • 2.2 编译预览
    • 三、发布
      • 3.1 在微信开发者工具进行上传
      • 3.2 管理平台的版本管理
      • 3.3 手机扫描二维码
    • 四、总结

记录小白使用 Cursor 开发第一个小程序>微信小程序(二):创建项目、编译、预览、发布(250308)


一、创建项目

(1) Cursor 使用 0.46.8 版本
(2) 随便买一个一天的会员(使用普通账号的话,Sonnet 3.7 经常卡)试水

1.1 生成提示词

(1) 第一个版本的提示词

# 小程序>微信小程序需求## 项目概述
构建一个小程序>微信小程序,用于记录工作打卡时间和查看历史记录。## 功能页面### 第一个界面:打卡页面
- 记录上班时间以及下班时间
- 显示目标工作时长为10.2个小时
- 显示本月历史打卡记录的平均工作时长
- 提供跳转到历史记录页面的功能### 第二个界面:历史记录页面
- 以日历形式呈现历史打卡记录
- 显示本月的平均工作时长
- 点击任意日期可显示所选日期的上下班时间
- 支持对历史的上下班时间进行修改
- 修改完上下班时间后,本月的平均工作时长需重新计算并自动更新## 技术要求
- 所有数据保留在本地,不需要调用任何API接口

(2) 第二个版本的提示词:使用 cursor 对第一个版本进行完善

# 小程序>微信小程序需求## 项目概述
构建一个小程序>微信小程序,用于记录工作打卡时间和查看历史记录。## 功能页面### 第一个界面:打卡页面
- 记录上班时间以及下班时间
- 显示目标工作时长为10.2个小时
- 显示本月历史打卡记录的平均工作时长
- 提供跳转到历史记录页面的功能
- 打卡按钮设计醒目,易于操作
- 实时显示当前日期和时间
- 当天已打卡状态明显展示(上班已打卡/下班已打卡)### 第二个界面:历史记录页面
- 以日历形式呈现历史打卡记录
- 显示本月的平均工作时长
- 点击任意日期可显示所选日期的上下班时间
- 支持对历史的上下班时间进行修改
- 修改完上下班时间后,本月的平均工作时长需重新计算并自动更新
- 提供返回打卡页面的导航功能
- 对于工作时长不足10.2小时的日期进行视觉提示(如标红)
- 支持按周、月查看统计数据## 用户体验要求
- 简洁明了的界面设计,符合微信设计规范
- 关键信息(如工作时长、打卡状态)字体加大或高亮显示
- 操作流程简单直观,减少用户学习成本
- 加载速度快,响应及时## 技术要求
- 所有数据保留在本地,使用小程序>微信小程序的本地存储能力
- 确保数据在应用关闭后仍能保存
- 考虑数据备份和恢复机制
- 适配不同屏幕尺寸的设备## 其他功能建议
- 支持设置个性化的工作时长目标
- 提供月度/季度工作时间统计报表
- 可选的提醒功能(如工作时间即将达到目标时通知)
- 支持数据导出功能(如导出为Excel表格)

1.2 生成代码

本次开发基于的大模型是 3.7-sonnet-thinking

二、编译预览

2.1 导入项目

使用上个帖子下载页面下载的 "微信开发者工具" 导入,可以先用 "测试号"

2.2 编译预览

每次编译前,先清缓存

(1) 打卡页面

在这里插入图片描述

(2) 历史页面

在这里插入图片描述


三、发布

3.1 在微信开发者工具进行上传

是需要使用正式的 appid

3.2 管理平台的版本管理

开发版本设置为体验版

3.3 手机扫描二维码

小程序>微信小程序直接使用

四、总结

  • 不会写提示词可以将自己的需求简单描述,然后让大模型完善
  • 尽量一次性把需求描述完整
  • 3.7-sonnet-thinking 不愧为当前地表最强
  • 生成的东西有瑕疵,需要继续润色

血的教训:做好版本管理,避免无法回滚


http://www.ppmy.cn/ops/165590.html

相关文章

线性代数(1)用 excel 计算鸡兔同笼

线性代数+excel计算鸡兔同笼 案例:鸡兔同笼问题的三种解法(递进式教学)一、问题描述二、方程式解法(基础版)步骤解析三、线性代数解法(进阶版)1. 方程组转化为矩阵形式2. 矩阵求解(逆矩阵法)四、Excel计算法操作步骤案例:鸡兔同笼问题的三种解法(递进式教学) 一、问…

Chrome 扩展开发 API实战:Sessions (六)

1. 引言 chrome.sessions 是 Chrome 扩展开发者工具的一部分,提供了对最近关闭的标签页和窗口的访问,以及对会话恢复功能的支持。现代浏览器的一个显著特点是为用户提供更多的便利性,比如快速恢复意外关闭的页面。通过 chrome.sessions API&…

Node.js Web 模块详解

Node.js Web 模块详解 引言 Node.js作为一款流行的JavaScript运行环境,以其高性能、事件驱动和非阻塞I/O模型而闻名。在Node.js中,模块是构建应用程序的基础,也是其强大的关键所在。本文将详细介绍Node.js的Web模块,包括其基本概…

芯片设计面面观 -- 表格版+文字版

本文将用表格和文字两种形式,对芯片设计流程做多维度分析。 ##表格分析 以下是芯片设计流程的多维度分析表格,涵盖各阶段的目标、输入、输出、工具链、挑战及技术趋势: 按阶段看 阶段目标输入输出工具链挑战技术趋势系统设计定义芯片功能…

每日一题之储存晶体

问题描述 威慑纪元 2230 年,人类联邦在与三体文明的对抗中,为了强化飞船的能源储备,决定收集能量晶体。飞船的储存空间呈矩形,边长分别为 a 和 b。对于一个能量晶体,只有当它的长度小于或等于存储空间的对角线长度时&…

[排序算法]直接插入排序

1.基本思想 直接插入排序是一种简单的插入排序法,其基本思想是:把待排序的记录按其关键码值的大小逐个插入到一个已经排好序的有序序列中,直到所有的记录插入完为止,得到一个新的有序序列。 实际中我们玩扑克牌时,就用…

快速排序(分治法)

通过筛选一个基准元素,将待排序列分割成两个子序列,使其中一个子序列所有元素都小于等于基准元素,另一个子序列的元素都大于基准元素,然后再对这两子序列分别再进行快速排序,直到整个序列有序。 示例 假设数组为 [3,…

mongodb与爬虫的关系

MongoDB 与爬虫之间的关系主要体现在数据存储和管理的层面。爬虫(Web Crawler 或 Spider)是一种自动化工具,用于从互联网上抓取网页内容或特定数据。而 MongoDB 是一个 NoSQL 数据库,常被用来存储和管理爬虫抓取到的数据。以下是它…