企业官网建设流程全解析

昨天跟一个做前端的朋友聊到“现在学小程序开发还有没有必要”，我随口说了一句“我现在写代码基本靠AI了”，他第一反应是觉得我在吹牛。然后我打开电脑，用WorkBuddy把一个刷题类小程序的页面框架、题库数据结构和答题判定逻辑在半小时内搭了出来，他当场不说话了。

这件事挺有意思的。AI时代的小程序开发，跟五年前完全是两个玩法。以前你得先学HTML/CSS/JavaScript三件套，再啃微信官方文档，弄懂组件生命周期、事件绑定、数据绑定，光是环境配置就能劝退一批人。现在不一样了，你真正需要具备的能力变成了三样：把需求说清楚、知道AI擅长什么不擅长什么、看得懂AI给你的代码并且能改对。

这篇东西我想完整记录一下“当WorkBuddy遇上刷题”这个项目的全过程。包括WorkBuddy是什么、怎么装、怎么做本地部署、怎么把“刷题小程序”的需求拆给AI、AI生成的代码里有哪些坑、最后怎么用hBuilderX跑到微信开发者工具里。适合两类人看：一类是想入门小程序开发但一直没动手的，另一类是已经在用AI写代码但总觉得哪里不对劲的。

1. 从一台旧电脑开始：WorkBuddy到底是个什么工具

先说结论，WorkBuddy不是那种“你问一句它答一句”的聊天框，它更像一个常驻在你电脑里的AI开发工作站。你可以把它理解成一个桌面级的智能体环境——界面是工作区形态，中间是对话和任务面板，左右两侧是文件树和预览区，AI可以直接读你本地的项目文件，也可以执行命令、运行脚本、改代码，再把结果展示给你看。

很多人在网上搜“WorkBuddy教程”，看到的是英文界面就有点怵。其实这东西上手门槛没有想象中高，核心逻辑就一句话：它是一个能干活的工作台，不是只会聊天的机器人。

跟它最像的产品是CodeBuddy，但两者定位有区别。CodeBuddy更多是“嵌入IDE的AI插件”，你在VS Code或者JetBrains里装上它，写代码的时候有自动补全、有对话窗口帮你改代码。WorkBuddy则是独立的桌面应用，它本身就是一个完整的开发环境，支持导入本地项目、管理文件、执行终端命令，同时内置了模型调度、Skill（技能）管理这些能力。打个比方：CodeBuddy是你写字台上的一个好用的笔架，WorkBuddy更像是整个写字台本身。

我用WorkBuddy跑这个刷题小程序项目，跑下来最强烈的感受是：它最适合的场景是“从0到1的完整小项目”。因为它能看着你的整个文件结构干活，不像网页版对话那样每次都要你去粘贴文件内容、说明上下文，效率高很多，尤其适合小程序这种“一个项目里有几十个文件、文件之间互相引用”的工程。

WorkBuddy在模型选择上也比较灵活。你既可以用它的云端模型服务，也可以配置本地模型，比如用Ollama跑DeepSeek、Qwen这类开源模型，数据完全留在本地。这也是为什么网上搜“WorkBuddy本地部署”“WorkBuddy下载”的人那么多——很多开发者对数据隐私有要求，不想把代码扔到云端。

安装这块，我直接去官网下的Windows安装包，装完大概占用1个多G空间。第一次启动会引导你配置模型，有两条路：

1. 云端模型：填API Key就能用，适合不想折腾本地模型的用户
2. 本地模型：通过Ollama加载DeepSeek等模型，适合对隐私敏感或者网络环境不稳定的用户

我测试的时候用的DeepSeek，大概量化版有4.7G。在这台旧电脑上跑，生成速度大概是每秒十来个tokens，虽然不算快，但写一个页面框架绰绰有余。

1.1 WorkBuddy的Skill机制：为什么说它是“给AI安排任务”的正确姿势

WorkBuddy里有一个概念叫Skill，这是它相对其他AI编程工具最特别的地方。所谓Skill，就是一套预先定义好的“任务规范”——你告诉AI做什么、按什么步骤做、输出什么格式，它就会按照这个规范去执行。你可以把它理解成给AI写岗位说明书。

这次刷题小程序项目，我就用Skill把“AI充当小程序开发工程师”这件事规范化了。Skill里包含了：

• 角色：AI扮演微信小程序开发工程师
• 任务：根据题目清单生成小程序代码
• 约束：使用原生小程序框架，不使用第三方UI库，兼容iOS和Android
• 输出：每个页面包含wxml、js、json、wxss四个文件，数据单独放一个js文件

定了这个Skill之后，我只需要把标题和需求发给它，它生成的代码就非常规矩，不会东一榔头西一棒子。如果你不用Skill直接跟它对话，它生成的代码往往结构比较散，页面之间风格也不统一。

1.2 本地部署的PCD普通用户路线图

本地部署这块多说几句。很多人问“WorkBuddy本地部署到底难不难”，我实际走下来，核心流程就四步：

1. 安装Ollama，这个工具是用来跑本地大模型的
2. 在Ollama里拉取一个模型，我用的是deepseek-r1:7b
3. 在WorkBuddy的设置里把模型源指向本地地址
4. 测试连通性，跑一个简单任务验证

这里有个坑要提醒：本地跑大模型非常吃内存。7B量级的模型大概需要8G左右的内存，如果你的电脑只有16G内存，建议不要再开太多其他程序。我测试的时候开着微信开发者工具加WorkBuddy再加浏览器，电脑风扇转得跟飞机起飞似的。

如果电脑配置不够，我建议直接用云端模型。反正对于小程序开发这种任务，你不需要多惊艳的模型能力，关键是上下文窗口要够大、能记住你项目结构就行。

2. 刷题小程序的需求拆解：先别让AI写代码，先让AI懂你的题库

很多人在AI编程工具上栽跟头，原因不是工具不行，而是需求没说清楚。你发一句“帮我写个刷题小程序”，AI给你生成的东西大概率是花架子——有首页、有列表、有答题页，但题目是假数据，逻辑是硬编码。看着像那么回事，实际上没法用。

所以这次我特意先花时间把需求文档整理了一遍，尤其是题库数据结构这一块。刷题类小程序，说破天核心就三部分：题目从哪来、题目怎么展示、答完题怎么判。

2.1 用JSON组织题库：把散装题目变成结构化数据

我手头有100道Python基础题，是从过去练习笔记里整理出来的。原始形态是这样的：

题目：Python中用于定义函数的关键字是？ A. def B. function C. func D. define 答案：A

这种文本格式人看着没问题，但程序没法直接处理。所以第一步是转成JSON，每个题目一个对象，包含id、type（题型）、question（题干）、options（选项）、answer（答案）、analysis（解析）这些字段。

我编了一个转换脚本的Prompt让WorkBuddy帮我写，然后就得到了类似这样的结构：

questions = [ { "id": 1, "type": "single", "question": "Python中用于定义函数的关键字是？", "options": ["def", "function", "func", "define"], "answer": 0, "analysis": "Python使用def关键字定义函数。" } ]

这里有个细节值得注意：answer字段我设计成了选项索引（整数），而不是选项内容（字符串）。因为选项文本可能会调整，索引则稳定不变。这个设计直接决定了后面答题判定的逻辑复杂度，如果一开始就乱来，后面AI写得再好也救不回来。

2.2 页面结构设计：五个页面各自干什么

刷题小程序我最终定了5个页面，功能边界划分得很清楚：

这个结构是从普通刷题类App抄过来的成熟模式，不算什么创新，但它最大的好处是每个页面职责单一，AI生成代码时不容易乱。你要是让AI一口气把五个页面揉成一个页面，它非得给你写出一坨“屎山”不可。

2.3 把需求写成Skill：给AI一份“听得懂”的说明书

这步是整个项目的分水岭。很多人用AI写代码，就直接把需求贴到对话框里，AI写一句算一句，写完了你不知道它有没有理解全。用WorkBuddy的Skill机制就不一样了，你可以把需求文档放进Skill，AI会把整份文档作为自己的“操作手册”。

我的Skill文件核心部分长这样：

任务目标： 生成一个微信小程序刷题应用，包含5个页面（首页、题目列表、答题页、结果页、错题本）。 数据要求： - 题库数据放在 /data/questions.js 文件中 - 每个题目包含 id、type、question、options、answer、analysis 字段 - answer为选项索引，从0开始 技术约束： - 使用原生微信小程序框架 - 不使用第三方组件库 - wxml中不允许使用函数调用（如 array.map），循环用 wx:for 实现 输出要求： - 每个页面生成 .wxml .js .json .wxss 四个文件 - 代码中要包含中文注释，关键逻辑要写清思路 - 样式使用 rpx 单位，适配不同屏幕

这里面的“wxml中不允许使用函数调用”那条约束，是踩过坑之后总结出来的经验。微信小程序的模板语言能力有限，不像Vue那么强大，你在wxml里用方法做数据变换，小程序的WXS（WeiXin Script）处理起来很麻烦，直接卡死你。提前约束好，能让AI少走弯路。

3. 实战生成：WorkBuddy产出小程序代码的全过程记录

需求拆好了、Skill写好了，接下来就是真正的干活环节。我按时间线把这个过程完整记录下来，包括中间AI生成的代码出了什么问题、我怎么一步步修正的，这部分应该能帮你避开不少坑。

3.1 第一步：让WorkBuddy生成全局配置和数据文件

我先让WorkBuddy读Skill，然后让它生成小程序的基础工程结构。大概半个小时后，它生成了一个标准的微信小程序目录结构：

miniprogram/ ├── app.js ├── app.json ├── app.wxss ├── data/ │ └── questions.js ├── pages/ │ ├── index/ │ │ ├── index.wxml │ │ ├── index.js │ │ └── index.json │ ├── list/ │ ├── quiz/ │ ├── result/ │ └── mistakes/

这个结构基本可以直接用。我特别检查了app.json，这是小程序的全局配置，里面声明了所有页面路径、窗口样式、tabBar等等。AI默认生成的tabBar只有首页和列表页两个tab，我把错题本也加了进去，这样用户能直接通过底部导航进入错题本。

贴一下我当时在app.json里加的tabBar配置：

"tabBar": { "list": [ { "pagePath": "pages/index/index", "text": "刷题" }, { "pagePath": "pages/list/list", "text": "题目" }, { "pagePath": "pages/mistakes/mistakes", "text": "错题" } ] }

tabBar的图标我暂时没配——AI生成的图标一个是加载图片路径的，实际开发中你要么用设计好的图标，要么临时用iconfont的在线图标。但小程序原生tabBar不支持远程图标，所以你必须要本地图片。这一步我当时偷懒跳过了，后面预览的时候tabBar那一栏显得很干瘪，算是偷懒的代价。

3.2 第二步：答题页的核心逻辑——AI生成的代码有哪些坑

答题页是整个小程序最核心的页面，也是AI最容易翻车的地方。我先说说预期逻辑：进来之后显示第一题，点击选项选中，点“下一题”跳到下一题，到最后一题时点“交卷”，跳转结果页。同时用户答错的题要记到错题本里。

WorkBuddy第一次生成的答题逻辑，用的是这样的写法：

Page({ data: { questions: [], currentIndex: 0, selectedOption: -1, answers: [] }, onLoad() { const questions = require('../../data/questions.js') this.setData({ questions: questions.questions }) }, selectOption(e) { const index = e.currentTarget.dataset.index this.setData({ selectedOption: index }) }, nextQuestion() { const { currentIndex, answers, selectedOption, questions } = this.data if (selectedOption === -1) { wx.showToast({ title: '请先选择答案', icon: 'none' }) return } answers[currentIndex] = selectedOption this.setData({ answers, selectedOption: -1, currentIndex: currentIndex + 1 }) } })

看这段代码，逻辑本身是通的，但它有个问题：没有记录用户所选答案的文本，只存了索引。后面结果页显示“你的答案：A”的时候，你无法直接从索引映射回选项文本。表面上看索引够了，实际上结果页需要展示内容时，你还得在结果页重新拿着索引去questions[currentIndex].options[answerIndex]里取一次文本。这不算致命错误，但确实绕。

我还发现一个更隐蔽的问题：first render时onLoad里的异步require可能会导致渲染时数据还没到。在小程序里，require一个本地js文件是同步的，所以这里没问题。但如果AI把数据改成从某个接口拉取，那就变成异步了，很可能出现首帧白屏的情况。AI在这类异步时序问题的处理上，往往不如老手程序员想得周全。

3.3 第三步：结果页和错题本的关联设计

结果页这边，我的设计思路是：交卷后带着一组“题目序号+用户答案”的数组跳进结果页，结果页负责把每个题的判定结果、正确答案、解析展示出来。

这里有一个前后端数据传递的技巧，AI一开始没做对——它以为把整个数组放到URL参数里传就行了，但小程序页面跳转URL的参数是字符串，塞不下一个数组。后来我让它改成用全局变量或者storage传，代码就顺了：

// 在答题页交卷时 wx.setStorageSync('quizAnswers', this.data.answers) wx.navigateTo({ url: '/pages/result/result' }) // 在结果页读取 const answers = wx.getStorageSync('quizAnswers') || []

错题本更简单，交卷的时候把答错题的ID和用户答案存进去，在错题本页面读取并渲染：

const wrongQuestions = wx.getStorageSync('wrongQuestions') || [] wrongQuestions.push({ questionId: question.id, userAnswer: selectedOption, correctAnswer: question.answer }) wx.setStorageSync('wrongQuestions', wrongQuestions)

到这里，WorkBuddy帮我搭起来的核心逻辑算是能跑通了。全程耗时大约一个半小时，包括改bug和调试在内。这个速度，放在以前我自己从零手写，少说也要一个周末。

4. 从WorkBuddy到微信开发者工具：hBuilderX转会流程里的隐秘细节

很多人问“WorkBuddy能用hBuilderX开发微信小程序吗”，我这次的路线是：WorkBuddy负责生成代码，hBuilderX负责把代码转成微信小程序工程结构并调试预览。中间绕了一个弯，但还是走通了，这里说说完整链路上那些文档里没写清楚的事。

4.1 hBuilderX在这个链路里到底扮演什么角色

先捋一下工具分工：

• WorkBuddy：AI辅助生成源码
• hBuilderX：一个集成开发环境，核心功能是把uni-app之类的项目编译成各端小程序代码
• 微信开发者工具：腾讯官方调试器，真正运行和验证小程序的地方

刷题小程序项目里有两条路把代码跑到微信开发者工具里：

1. 源码是标准微信小程序原生项目的，直接用微信开发者工具打开源码目录，预览出来即可
2. 源码是uni-app项目，就得用hBuilderX跑uni-app的编译任务，把代码编译生成到dist/dev/mp-weixin目录，再用微信开发者工具打开这个目录看效果

我这次用的是原生小程序方案，所以严格来说hBuilderX只是用来导入查看工程和配置的，真正编译工作由微信开发者工具自己完成。如果你打算用uni-app做跨端应用，那hBuilderX的作用就重要得多——不过那就是另一个项目了。

4.2 原生小程序和uni-app：AI生成的代码是哪种形态

WorkBuddy默认生成的是原生小程序代码，因为我在Skill里明确写了“使用原生微信小程序框架”。好处是直接打开就能跑，坏处是以后要做H5或者App端就得重写。

如果你想要的是多端复用的方案，生成代码前就得让AI按uni-app的语法来写：页面结构虽然还是vue单文件组件，但生命周期要写成onLoad而不是mounted。这些细节AI不一定知道，你需要在Skill或prompt里声明清楚。

一个经验之谈：如果项目只做微信小程序，就用原生方案，少一层编译就少一层坑。如果未来可能要做支付宝小程序、抖音小程序，那就直接上uni-app，后期不用返工。

4.3 微信开发者工具显示“无法读取app.json”这类问题怎么处理

我第一次用微信开发者工具打开WorkBuddy生成的目录时，直接就报错了：app.json: 文件未找到。

查了一下，原因是WorkBuddy把项目文件生成在了带版本号的子目录里，而微信开发者工具的“导入项目”要求你选中包含app.json的那个目录作为根目录。解决方式很简单：把miniprogram/这个文件夹里的所有内容拷到一个干净的目录，再在微信开发者工具里选择“导入项目”，选中该目录即可。

后面又遇到一个更奇葩的报错：app.json: app.json 未找到实际上下面其实有project.config.json提示：工具在读取app.json前会先找project.config.json定位，如果你直接导入的是源码目录本身，它可能找不到该文件，就用默认值去读取了。解决办法是让WorkBuddy在项目根目录也生成一份project.config.json，并写明"miniprogramRoot": "miniprogram/"。

这个文件长这样：

{ "description": "刷题小程序", "packOptions": { "ignore": [] }, "setting": { "urlCheck": false, "es6": true, "postcss": true, "minified": true }, "compileType": "miniprogram", "libVersion": "3.0.0", "appid": "touristappid", "projectname": "quiz-miniprogram", "miniprogramRoot": "miniprogram/" }

注意appid字段，我填的是touristappid，这是测试号，游客模式，不需要注册小程序账号就能预览。如果你有正式的小程序AppID，填进去就行，可以用真机预览和上传代码。

4.4 预览时的样式问题：rpx和px的一步之遥

第一个页面跑起来之后，我发现文字和按钮的尺寸都偏大，而且在iPhone SE和iPhone 14 Pro上的观感差异很明显。原因很简单：AI生成的样式里用了不少px硬编码。微信小程序的屏幕适配，应该使用rpx（responsive pixel）单位。

rpx的换算规则是：在任何屏幕上，宽度都是750rpx。所以如果设计稿是750宽，那么设计稿上的多少px就是多少rpx。如果设计稿是375宽（iPhone 6/7/8的基准宽度），那么1px = 2rpx。

AI生成代码时如果没被明确告知，是很容易用px的。我在Debug时发现首页按钮的font-size: 28px在iPhone 14 Pro上显得特别大，因为那是真机，不是模拟器。后来我批量改了样式文件里的字体和间距相关属性，全部替换成rpx单位，观感立刻正常了。

如果你不想手动改，可以在WorkBuddy的Skill里预先加上一条：“所有尺寸、字体、边距统一使用rpx单位。”这样AI生成时就不会放飞自我了。

5. 翻车现场复盘：WorkBuddy生成代码时最常见的四类问题

说句公道话，AI编程工具确实能把开发效率提升一大截，但它的输出绝不是“拿来即用”的。这次用WorkBuddy做刷题小程序，我至少踩了四类坑，每一类都值得单独拎出来说说，因为以后你大概率也会遇到。

5.1 第一类坑：数据绑定里的双向绑定误区

这个问题在AI生成的代码里出现频率非常高。AI会把Vue的思想带到小程序里来，写出来的代码类似：

<input value="{{inputValue}}" />

结果在小程序里，你直接在input里输入内容，inputValue并不会跟着变。小程序没有Vue那种自动双向绑定，你必须在bindinput事件里手动setData。AI需要被明确告知“小程序是单向数据流”，它才不会默认套用Vue的思维。

我当时发现AI生成的搜索框功能失灵，排查了半天，最后定位到就是因为这个。正确写法是：

<input value="{{inputValue}}" bindinput="handleInput" />

handleInput(e) { this.setData({ inputValue: e.detail.value }) }

5.2 第二类坑：setData的key不能带特殊字符

这个坑更隐蔽。我在设计错题本页面时，想让每个错题都可以单独折叠展开，State结构用了类似：

this.setData({ [`item-${index}.isOpen`]: true })

在小程序里这种带-的key在小程序里会直接炸。setData的路径中只支持字母、数字、点号和方括号，不能包含连字符。最后我改成：

this.setData({ [`items[${index}].isOpen`]: true })

稳妥很多。这个经验的价值在于：AI生成的动态key操作，说不好就会踩中底层限制，你必须有意识地审查这类代码。

5.3 第三类坑：wxml里不能用复杂的JavaScript表达式

很多AI在生成Vue代码时，习惯了在模板里写一堆表达式，比如：

<view>{{questions[currentIndex].options[selectedOption]}}</view>

这种链式索引在Vue里没问题，但在小程序的wxml里，它可能直接渲染不出来或者报错。WXML支持的操作符非常有限，不支持动态的链式索引。

解决办法是：所有需要在模板里展示的数据，都提前在js的data里处理好。比如在selectOption事件里就把当前题目、选项文本、答案文本这些都setData进去，模板只负责展示，不负责计算。

5.4 第四类坑：require路径不对，模块引入失败

WorkBuddy生成的代码里，require路径用的是相对路径，比如：

const questions = require('../../data/questions.js')

这个路径是否正确，取决于文件的实际位置。如果WorkBuddy把questions.js放到了miniprogram/data下，而页面在miniprogram/pages/quiz下，那么从quiz目录到data目录的路径是../../data/questions.js，没错。

但问题是AI有时候会在“模拟环境”里把目录结构创建错了位，或者多个版本并行开发时把文件复制到别的路径，导致require报错。这类问题排查起来很枯燥，我当时的做法是让WorkBuddy用find命令把所有js文件的位置列出来，比对一下路径，再统一修正require引用。

这一类的经验总结起来就一句话：用AI生成代码，验收的时候一定要按“数据流”走一遍。从数据加载、到页面渲染、到用户交互、到结果反馈，每个环节都测一遍，不能因为页面能打开就说完成了。

6. 我再加一个功能：把“每日一题”和题目随机抽题做进去

核心功能跑通之后，我顺手用WorkBuddy加了两个小功能：每日一题和随机抽题。加这两个功能不是为了炫技，而是想验证一件事：AI在一个已有项目上做增量开发，效率到底高不高。

实测下来，结论是：增量开发比从零开发更考验你对项目的理解，也更考验AI对已有代码风格的一致性把握。

6.1 每日一题：本地存储模拟“每日”

每日一题的逻辑不复杂：用户进入首页时，读取本地缓存里记录的“今天做题日期”，如果跟当前日期不一致，说明是今天第一次来，从题库里按日期哈希选出一道题展示给用户；如果已经做过了，就展示缓存里的那道题。

我让WorkBuddy在首页加了一个“每日一题”模块：

onShow() { const today = new Date().toDateString() const daily = wx.getStorageSync('dailyQuestion') if (!daily || daily.date !== today) { const index = this.getDailyIndex() const question = this.data.questions[index] this.setData({ dailyQuestion: question }) wx.setStorageSync('dailyQuestion', { date: today, questionId: question.id }) } else { const question = this.data.questions.find(q => q.id === daily.questionId) this.setData({ dailyQuestion: question }) } }

这里有个小细节，“按日期哈希选题目”我让AI用了一个简单的字符串哈希函数，把日期字符串转成哈希值，再对题库长度取模。这样同一天内每次打开都是同一道题，连续几天下来不会重复题号，体验感比简单的随机数强很多。

6.2 随机抽题：利用Fisher-Yates洗牌算法

随机抽题功能，我做的是“随机挑战10题”模式，每次从题库里随机抽10道题不重复，做成一套新的卷子。AI用的洗牌算法是Fisher-Yates（也叫Knuth shuffle），这是最经典的无偏洗牌算法，每个排列出现的概率相等。

function shuffle(arr) { const result = [...arr] for (let i = result.length - 1; i > 0; i--) { const j = Math.floor(Math.random() * (i + 1)) ;[result[i], result[j]] = [result[j], result[i]] } return result }

这块我没什么好改的，AI区分得很清楚：随机抽题的题目顺序要打乱，但选项本身要保持原顺序不能打乱，否则答案索引就乱了。这种细节AI能意识到，我还挺意外的。

6.3 增量功能带来的结构性问题

加了这两个功能之后，首页的wxml变得比以前长了不少。WorkBuddy在处理“在已有页面里加新模块”这个任务时，倾向于往里追加代码，而不是重构。这就带来一个问题：页面的wxml和js文件越来越长，可读性越来越差。

这也是我目前对AI生成代码最大的担忧之一。好的代码不是能跑就行，还要整洁、可维护、别人能接手。AI生成的代码，跑起来往往没问题，但代码组织和命名规范常常一言难尽。比如它会生成一些无用变量、重复的数据处理逻辑、甚至把不该放在data里的数据也放进去。这些如果不手动清理，时间久了就是一笔技术债。

我的应对策略是：每个功能开发完，花十分钟让AI做一次代码审查。我会直接跟WorkBuddy说：

请审查首页的js文件，列出以下问题： 1. 是否有未使用的变量和函数 2. 是否有重复的setData逻辑可以合并 3. 是否有被注释掉的死代码 4. 数据结构是否可以简化

它生成的代码审查报告，有时候比它写代码的能力还让我满意。这一点我觉得是很多人没用起来的功能——AI不仅能写代码，还能当你的低成本代码审查员。

7. 收尾：发布前的检查清单和我的个人使用体会

最后这部分，说说这个刷题小程序项目跑通之后，我总结出来的一套“AI生成代码验收清单”，以及我对WorkBuddy这类工具的真实评价。没有标题党，都是实际操作得来的体验。

7.1 小程序发布前的必要检查项

跑到微信开发者工具里能预览只是第一步，真要发布到线上，还有很多细节点要过。我列一个自己反复用的检查清单，供你直接抄：

我这次特别注意了包体大小。AI生成的代码里可能包含一些它自己加的示例图片和冗余资源，我一看miniprogram目录总大小快3MB了，直接删掉了那些没用的图片，最后压缩到1.2MB，达标。

7.2 用WorkBuddy做项目，最大的隐性成本不是算力是审查

网上很多文章吹AI编程工具“一句话生成整个App”，我负责任地告诉你，那是流量话术。实际体验下来，AI确实能把“从0到1”的时间压缩90%，但“从1到能发布”的时间，你依然省不下来。

为什么？因为AI给你的是一个“应该是这样”的实现，但它不保证真的是这样。你得验证、你得测试、你得改bug，这些活的耗时一点不会少。好在你不用再写那些重复的样板代码了，省下来的精力可以投入到真正需要判断力的事情上——比如题目质量、用户体验、功能规划。

我个人的体会是：AI时代的小程序开发，门槛确实低了，但天花板反而高了。低门槛体现在你不用再死磕基础语法，高天花板体现在你要能把控更多环节——从需求设计到数据格式到用户体验，再到最后的发布运营。AI写代码，你指挥AI。指挥得好不好，取决于你对这个领域理解得深不深。

所以这次拿WorkBuddy做刷题小程序，我最大的收获反而不是代码本身，而是理顺了一整套“人机协作”的开发节奏：先用Skill定规矩，再让AI照着干活，最后自己带着审查清单验收。这套流程跑顺之后，做什么项目都快。

最后再分享一个小技巧：开发完某个页面后，截图发给WorkBuddy，让它帮你分析界面布局问题。它能直接指出哪里间距不对、哪里按钮层级不清晰，甚至能给出样式调整思路。把这个能力用起来，等于免费请了个带设计审美的同事帮你review界面，挺好用的。