AI帮我一下午做了个小程序但踩的坑比写的代码还多
- 2026-09-25 08:26:08
AI帮我一下午做了个小程序但踩的坑比写的代码还多A AI帮我一下午做了个小程序 但踩的坑比写的代码还多 作者：黄叔 下午三点，阳光正好。 我坐在电脑前，心里冒出一个念头：要不做个小程序吧——一个能在我低落时，给我一句治愈话的那种。 说干就干。 四个小时后，我的控制台长这样： SystemError (appServiceSDKScriptError) LifeCycle.load fail: Cannot set a non-pending waiting value Error: timeout 我的心情长这样： 😰😰😰😰😰 这篇文章，是我「一下午踩的坑比写的代码还多」的真实记录。 如果你也打算用AI辅助开发小程序，建议先把这篇收藏。因为我踩过的坑，你大概率也会遇到。 — ✦ — 
开发者开始创作的温馨场景 01 先说说我想做什么 现在的我们，节奏太快、压力太大。有时候不是不开心，只是需要一个出口。一句话、一段哲思，能让紧绷的神经松弛下来。 「哲芯小筑」就是我设想中的那个出口： • 心境自测 — 3道题，帮你定位当下的情绪状态 • 哲思解药 — 30条治愈内容，覆盖6大人生困境 • 哲思日历 — 每天推送一句哲学金句 • 思想实验 — 10个经典的哲学思辨场景 • 我的收藏 — 收集那些打动你的句子 技术栈很朴素：微信原生小程序 + 云开发。 一个下午，从零开始。我以为会很顺利。 — ✦ — 02 第一个坑：一打开就报错 项目导入完成，我按下「编译」。三秒后，控制台炸了。 SystemError (appServiceSDKScriptError) LifeCycle.load fail: Cannot set a non-pending waiting value Error: timeout 我的第一反应：代码写错了？于是开始排查。 尝试1：改配置文件 我把 尝试2：切换基础库版本 从开发版切到稳定版，又切回来。还是报错。 尝试3：关闭热重载 关掉「热重载自动刷新」，手动编译。依旧无效。 时间过去了 一个多小时。我的状态：眉头紧锁，反复刷新，开始怀疑人生。 ✅ App.onLaunch took 101ms ← app.js 正常启动了 ✅ Launch Time: 11059 ms ← 小程序启动完成了 ❌ SystemError ... ← 但这里在报错 等等……模拟器里的小程序，好像在正常运行？ 我试探性地点击了几下——真的在跑。页面正常切换，数据正常加载，功能一切正常。 "那个报错，就像仪表盘上亮了个黄灯，但车子照开不误。" — ✦ — 
程序员调试报错场景 我学到了什么：建立判断框架 这次经历让我意识到一件事：开发过程中，至少有50%的报错是「假警报」。 学会区分「真问题」和「假警报」，是AI时代开发者的核心竞争力。 我的判断框架是这样的： 遇到报错？先问三个问题： 1. 功能真的坏了吗？ └→ 模拟器里手动试一下，别只看控制台 2. 用户端会出现吗？ └→ 开发者工具的Bug，生产环境大概率不存在 3. 影响热重载还是影响功能？ └→ 只影响热重载 → 可以忍；影响功能 → 必须修 "记住这个原则：车仪表盘的灯亮了，不代表发动机坏了。" 可能是传感器接触不良。而微信开发者工具，作为一款还在持续迭代的软件，确实存在一些这样的「传感器问题」。 — ✦ — 03 第二个坑：真正的功能问题来了 如果说第一个坑是「虚惊一场」，那第二个坑是真的让我出了一身冷汗。 心境自测：只有标题和按钮，题目呢？ 调试「心境自测」功能时，我发现页面只显示： 标题：测测你现在的心情 按钮：开始测试 题目呢？？？ 三道题去哪了？我开始检查WXML模板代码，发现它用了 然后我去JS文件里找这个变量——找不到。根本没有定义。 这就是问题所在：WXML里用了 修复方案：三行代码解决战斗 定位到问题后，修复其实很简单。我补充了三处关键代码： // 1. 在 data 里定义变量 data: { currentQuestion: null, // ... }, // 2. 初始化时设置第一道题 onLoad: function() { this.setData({ currentQuestion: this.data.questions[0] }); }, // 3. 点击下一题时更新变量 nextQuestion: function() { // ...逻辑判断后 this.setData({ currentQuestion: nextQuestionData }); } 改完保存，刷新。题目出来了。功能正常了。 那一刻，我长舒一口气。 
代码修复成功后的喜悦 — ✦ — 04 AI+MCP：开发效率提升10倍的秘诀 这次开发过程中，真正让我感到「未来已来」的部分，是 AI + MCP 的组合。 没有MCP，AI只能陪你聊天 假设你问ChatGPT：「帮我写个小程序心境自测的代码」 它会给你一段代码。你复制粘贴进去。然后呢？文件在哪里？数据库在哪里？怎么部署？AI不知道。 "没有MCP的AI，就像一个只能动嘴的军师——有想法，但落不了地。" 有MCP，AI成了你的得力助手 MCP（Model Context Protocol）是一种让AI「操作真实世界」的标准协议。 有了MCP，AI可以： • 读写你的本地文件 • 调用你的API接口 • 查询和写入数据库 • 部署云函数 • 执行终端命令 也就是说，我可以对AI说： 「帮我把 AI直接操作数据库，改完了告诉我：「已完成。」 不需要我手动打开数据库、找到表、修改字段、确认保存。效率提升，不是一点两点。 我的实际工作流 整个「哲芯小筑」的开发，我的分工是这样的： 我（决策者） ├─ 需求定义：「这里要加个收藏功能」 ├─ 问题判断：「这个报错是真的还是假的？」 ├─ 代码审查：「这段逻辑好像有问题」 └─ 最终拍板：「可以，上线」 AI+ MCP（执行者） ├─ 写代码：「根据你的需求，生成代码如下」 ├─ 改数据：「数据库已更新」 ├─ 部署函数：「云函数部署成功」 └─ 调试排查：「根据日志，问题可能在第23行」 "我负责想，它负责做。" 
AI与人类协作开发 — ✦ — 05 项目概览与技术细节 说几个技术细节，给想自己动手的朋友。 项目规模 📦 miniprogram ├── 📄 总计：43.17 KB ├── 📊 微信限制：2048 KB └── 📈 已用比例：2.1% 43KB，远没到上限。但小程序第一次上传时，我手抖了一下——生怕哪里配置错了导致超限。 实际上，微信对代码包的限制是2MB，正常开发很难超过。除非你往里塞了几百MB的图片或视频资源。 上传时的注意事项 微信小程序上传有几点需要注意： 1. 不能有未编译的ES6+语法 — 确保你的编译设置正确 2. 不能有未绑定的事件 — WXML里的 3. 不能引用未在app.json注册的页面 — 每个页面都要在 说起来都是基础，但刚入门时，我全踩过一遍。 
小程序项目概览 — ✦ — 06 经验总结：什么该修，什么该忽略 回到开头说的「判断框架」。这次踩坑，我总结了几条具体经验： 🔴 必须立刻修的 • 功能不工作 — 用户点击没反应，页面显示空白，数据不加载 • 数据错乱 — 显示的内容和预期不符 • 安全问题 — 登录态泄露、接口没做权限校验 🟡 可以先观察的 • 开发者工具的报错，但功能正常 — 大概率是工具的Bug • 基础库版本切换后偶现的警告 — 可能是版本兼容问题，不影响生产 • 控制台的红叉叉，但页面渲染正确 — 优先看功能，别被红叉叉吓到 🟢 完全可以忽略的 • 热重载偶尔失效 — 手动刷新就好 • 模拟器的性能警告 — 真机运行完全没问题 • 开发阶段的临时性报错 — 正式发版前会统一处理 "核心逻辑：让「功能」来验证代码，而不是让「报错」来吓唬你。" 
经验总结与反思 — ✦ — 07 写在最后 开发「哲芯小筑」的那个下午，从三点到七点。 真正写代码的时间，大概只有 两个小时。 剩下的两个小时，全在调试。 但现在回想起来，那两个小时调试，比写代码的两个小时更有价值。 因为它让我明白： "代码只是工具，判断力才是核心。" AI能帮你写代码，但没法帮你判断： • 这个报错是真是假？ • 这个功能要不要做？ • 这个设计是否合理？ 这些判断，永远需要人来完成。 所以，面对AI浪潮，我的态度是： "拥抱它，用它提升效率；但别依赖它替你思考。" 最后，如果你在开发过程中也踩过什么「以为是Bug但其实不是」的坑，欢迎在评论区聊聊。 也许你的经历，能帮到下一个被仪表盘黄灯吓到的人。 
成长与反思 我是黄叔，加我好友入群共同学习 
project.config.json 里能调的参数都调了一遍。没用。💡 关键转折：它居然能跑？
就在我快要放弃的时候，余光瞥见了控制台底部一行小字：
currentQuestion 这个变量来显示当前题目。{{currentQuestion}}，但JS里压根没有这个变量。💡 这里我想多说两句
很多新手开发者会遇到这个问题：WXML用了 {{xxx}} 但 data 里没定义 xxx。
微信小程序的渲染机制是这样的：
如果你在模板里用了某个变量，但JS的data对象里没有这个字段——页面会渲染失败，显示空白。
不会报错。只是静默地「不显示」。
这和PC端开发很不一样。在浏览器里，未定义变量通常会抛出异常；但小程序会默默忽略它。
所以，养成习惯：每次在WXML里写 {{xxx}}，立刻去JS里确认 xxx 是否存在于data中。
哲思解药 的分类从5个改成6个，增加一个新分类叫'关于死亡'，每类5条内容」bindtap 必须在JS里有对应函数pages 数组里声明
本文来自网友投稿或网络内容，如有侵犯您的权益请联系我们删除，联系邮箱：wyl860211@qq.com 。
