环境准备
查看官网知道，现在有uni-app 和uni-app-x ,但是uni-app-x需要用他们自己的编辑器，无法使用Trae cn,所以这里我们采用uni-app.
1.安装Node
Step1：下载安装包
根据自己电脑系统及位数选择，我的电脑是Windows系统、64位、想下载稳定版的.msi（LTS为长期稳定版）这里选择windows64位.msi格式安装包,这里需要选择24.x的版本
.msi和.zip格式区别：
- .msi是Windows installer开发出来的程序安装文件，它可以让你安装，修改，卸载你所安装的程序。说白了.msi就是Windows installer的数据包，把所有和安装文件相关的内容封装在一个包里。此外：它还包含有关安装过程自己的信息。例如：安装序列、目标文件夹路径、安装选项和控制安装过程的属性。
- .zip是一个压缩包，解压之后即可，不需要安装
无法访问官网
国内镜像 选择里面的24的文件夹下载压缩包进行接下即可，不需要安装
Step2:安装软件
安装的教程可以查看这个知乎文章
配置环境变量
若是压缩包使用的同学，需要配置环境变量。.msi格式的安装包已经将node启动程序添加到系统环境变量path中,咱们可以查看系统变量进行验证：在【个人电脑】右键→【属性】→【高级系统设置】 .
-
点击【高级】→【环境变量】
-
在系统变量中查看【path】，点击【编辑】
- 安装包的可以看到里面有各个安装的node的安装路径
- 解压包的同学，在打开的PATH界面点击右上角新建，将刚刚解压的node文件的路径复制进来
node+npm
安装node的同时已经安装了npm，验证 1.通过WIN+r,输入CMD，进入命令行界面 查看node版本：
node -v查看npm版本：
npm -v2.通过搜索，输入CMD，点击出现的命令提示符，然后其他操作参考上边的
配置npm镜像源
设置国内源
arduino
npm config set registry https://registry.npmmirror.com查看国内源
arduino
npm get registry这是为了后期如果需要下载包，国内镜像更加的方便，你要是有机场，这个步骤可以忽略
到这里我们就准备好基础的环境了，当然还需要安装TRAE CN。这个就去官网下载即可，这里就不再讲述了，若需要留言。
开始生成原型
这里通过豆包-AI编程-APP原型来进行设计,设计完还会和Deepseek进行一次对比。 为什么这么做，纯粹是我感觉Deepseek更懂我
2.豆包画原型
好了，我们输入如下需求：
我需要设计一个成长系统的APP： 1.能看到今天安排的学习任务，也能切换所属当前星期内的其他天的看， 2.任务完成有打卡功能，任务可以添加编辑删除，任务有一次性和周期性的，可以设置日期时间，内容，是否周期性(周期任务设置打开，之前的日期时间就没了)，是否避开节假日等 3.沟通界面，可以和成长系统沟通，通过系统设置学习任务 4.可以配置成长系统的api_key等 现在需要输出原型图，请通过以下方式帮我完成APP所有原型图片的设计。 1.思考「设计师社区APP」需要实现哪些功能 2.作为产品经理规划这些界面 3.作为设计师思考这些原型界面的设计 4.使用HTML在一个界面上生成所有的原型界面，可以使用FontAwesome等开源图标库，让原型显得更精美和接近真实我希望这些界面是需要能直接拿去进行开发的 5.每一个模块之间用Grid方式排版，根据屏幕宽度自适应，每行2～3个
然后我们得到了，一个没有样式的乱七八糟的页面，什么鬼：
原来是内部的Tailwindcss这边网络无法引入 ，重新输入：用其他第三方库替换tailwindcss，重新生成，我们于是得到了一个：
这里看着还可以，后续就是调整自己喜欢的颜色和样式
Deepseek原型
这是DeepSeek，你觉着哪个好看呢 
最终原型
最终综合多次多个生产的原型，调配后得到了：
3.uni-app
原型已有，那么我们就开始生成uni-app吧。
3.1 配置Trae cn智能体
为什么要开始这么做呢？ 因为在第一版的实践中，用通用的不设置，过程中如何不强制干预的话，它会慢慢慢慢的把项目变成一个普通的H5项目。所以我们通过智能体来限制它的技术栈
3.1.1 唤起AI面板
查看右侧AI对话面板是否显示，若没有通过CTRL+U唤起
1.打开设置 
2.智能体-创建 
3.设置智能体 
- 这里感觉最好是让智能体自己执行终端命令，方便。若是考虑安全等，可以取消，自己点击执行。
智能体的提示词放到文章最后了！！！
3.2 开始对话
项目工程一开始就是一个只有原型图(html)的空目录，因此我们直接让智能体从零开始创建
3.2.1 创建项目
这里第一个问题出现了，连不上github。最后去官网给的gitee的模板地址下载项目文件重新放入当前项目。 
将模板文件夹内的文件复制到当前项目里面：
复制后的目录如下：
我这是执行过一些命令，反正就是直接复制即可
3.2.2 根据原型创建界面
项目基础已经有了，那么现在就是让AI开始干活了
生成完相关文件后，我这有两个文件报错，怎么办？告诉AI那两个有问题，让他重新检查处理
3.2.3 运行查看
看似一帆风顺，实际上是步步有坑，一运行好嘛，还是有报错，就这么有错就让AI看修改，知道运行起来
看看下边就知道为什么让之前创建智能体的时候开启命令自动执行了。运行期间，自己在排除项目上的问题，AI在运行自己排查预览界面的报错并自己修改在运行。
直到出现如下字样，就说明项目已经运行起来了：
3.3 目前样式
目前样式基本就是基于原型的，只是各个运行的时候原型是html,有可能AI识别的不如用图片给他的好。期间出现底部导航没图标，首页缺失模块，你把原型截图给它，告诉缺哪让它补充即可。
要注意 智能体一直是设定的，因为它精准执行命令。 
这是效果，展示一下，已经能看出一个东西了，而且有简单的交互。
后记
开发结束了吗，没有，这还好多功能没开发。这里只是演示了一个全程全靠和AI沟通，完成APP开发的流程。 只能说，程序员的焦虑是真的！！
好了，等我搭建Flutter,然后看看Flutter版会是什么样子
提示词
看了下 提示词6000多字，我还是放个链接吧，别打我。 夸克的：
makefile
我用夸克网盘给你分享了「uni-app提示词.txt」，点击链接或复制整段内容，打开「夸克APP」即可获取。
/~f69c380BHJ~:/
链接：https://pan.quark.cn/s/3bdb9cbbd2f4
提取码：xx7a百度的：
bash
通过网盘分享的文件：uni-app提示词.txt
链接: https://pan.baidu.com/s/1AQP0eygVlqPy8xGZMBoIPA?pwd=hf3e 提取码: hf3e 复制这段内容后打开百度网盘手机App，操作更方便哦gitee地址：
arduino
https://gitee.com/xunhaifeng/uni_-app_-growth-system.git