企业官网建设流程全解析

1. 从零跑通小程序：为什么小白更需要一套可复制的流程

微信小程序开发这件事，对零基础的人来说，最劝退的往往不是写代码，而是「项目怎么建、编译报错看不懂、预览二维码刷不出来、发布卡在审核」这一连串流程问题。我见过太多人卡在第一步：用 Cursor 生成了一堆文件，结果微信开发者工具一导入就红一片，报错信息还全是英文，根本不知道从哪下手。

这篇内容聚焦的就是这条完整链路：用 Cursor 生成代码，用微信开发者工具完成项目初始化、编译、真机预览，最后提审发布。适合谁？适合完全没碰过小程序、但会用 Cursor 写点东西的开发者，也适合之前跑过一次但流程记不全、想找一份可对照清单的人。

核心检索词先明确：Cursor 微信小程序开发流程、微信开发者工具编译报错、小程序真机预览二维码、小程序提审发布检查清单。这四个词基本覆盖了从建项到上线的全部关键节点。

我自己的做法是：把 Cursor 当成「代码生成器 + 排错助手」，把微信开发者工具当成「运行环境 + 发布通道」。两者分工明确，Cursor 负责写 pages、app.json、逻辑代码，微信开发者工具负责编译、模拟器渲染、真机调试和上传。很多人搞混了，以为 Cursor 能直接跑小程序，其实不行，它只是编辑器，真正让代码跑起来的是微信开发者工具。

所以整篇的节奏是：先讲清楚项目结构和最小配置，再给可复制的 app.json 和目录树，然后进入编译和预览环节，最后是发布前的检查清单和常见报错对照。每一步都尽量给命令、给配置、给结果说明，让你照着做就能跑通。

如果你之前只写过网页，可以这样理解：小程序的 app.json 有点像网页项目的路由配置 + 全局设置，pages 数组就是页面路径列表，第一个就是首页。wxml 类似 HTML，wxss 类似 CSS，js 就是逻辑层。理解这层映射，后面看报错会轻松很多。

2. 用 Cursor 生成小程序项目骨架与 app.json 最小配置

这一步的目标很明确：让 Cursor 帮你生成一个能跑起来的最小项目，而不是一上来就堆功能。很多人失败的原因是提示词写得太贪心，一次要十几个页面，结果生成的文件互相引用错乱，编译直接崩。

我建议第一版只做两个页面：一个打卡页，一个历史记录页。提示词可以这样写，直接复制到 Cursor 的对话里：

# 微信小程序需求 ## 项目概述 构建一个微信小程序，用于记录工作打卡时间和查看历史记录。 ## 功能页面 ### 页面一：打卡页面 - 记录上班时间和下班时间 - 显示目标工作时长 10.2 小时 - 显示本月历史打卡的平均工作时长 - 提供跳转到历史记录页面的按钮 ### 页面二：历史记录页面 - 以日历形式展示历史打卡记录 - 显示本月平均工作时长 - 点击日期显示当天上下班时间 - 支持修改历史上下班时间，修改后平均时长自动重算 ## 技术要求 - 所有数据保存在本地，使用 wx.setStorageSync / wx.getStorageSync - 不调用任何外部 API - 适配不同屏幕尺寸

生成之后，你会得到一个类似这样的目录结构，这是小程序的标准骨架：

miniprogram/ ├── app.js ├── app.json ├── app.wxss ├── project.config.json ├── sitemap.json └── pages/ ├── index/ │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss └── history/ ├── history.js ├── history.json ├── history.wxml └── history.wxss

重点看 app.json，这是整个小程序的入口配置，最小可用版本长这样：

{ "pages": [ "pages/index/index", "pages/history/history" ], "window": { "navigationBarTitleText": "工作打卡", "navigationBarBackgroundColor": "#ffffff", "navigationBarTextStyle": "black", "backgroundColor": "#f5f5f5" }, "style": "v2", "sitemapLocation": "sitemap.json" }

这里有几个坑要提前说。第一，pages 数组里的路径不要带.wxml后缀，只写到文件名，比如pages/index/index，写错了会报「未找到入口 app.json 文件中的 pages 配置」。第二，第一个页面就是启动页，顺序不能乱。第三，style: "v2"是新版组件样式，建议保留，不然按钮样式会和文档不一致。

project.config.json 里最关键的是appid。测试阶段可以用「测试号」，微信开发者工具导入项目时会让你选。正式发布必须换成你自己的正式 appid，否则上传按钮是灰的。

Cursor 生成代码后，别急着全信。我实测下来，它偶尔会把wx.getStorageSync写成wx.getStorage，或者把Page({})写成Component({})，这些都会导致运行时报错。生成完先扫一遍 js 文件里的 API 名，确认是微信官方文档里有的。

如果你用的是 Cursor 的 Agent 模式，可以补一句「请检查所有 wx API 是否为微信小程序官方 API，并修正拼写错误」，能省不少排查时间。

3. 微信开发者工具导入项目与编译报错定位

项目文件有了，接下来就是导入微信开发者工具。打开工具，选择「导入项目」，目录选到miniprogram这一层，注意不是选它的父目录。AppID 那里，测试阶段点「测试号」，正式发布再换。

导入后工具会自动编译一次。如果一切正常，模拟器里会直接渲染出打卡页面。但小白第一次导入，大概率会遇到编译报错。下面这张对照表是我自己踩过的坑，你可以直接拿来查：

每次编译前，我建议先点一下工具上的「清缓存」→「清除全部缓存」，再点「编译」。这一步能避免很多「改了代码但模拟器没更新」的假问题。尤其是改了 app.json 之后，不清缓存有时候新页面不生效。

编译命令这块，微信开发者工具本身是图形化操作，没有命令行编译的强制要求。但如果你用 CI 或者想自动化，可以用微信官方提供的miniprogram-ci，不过对小白来说，前期先用工具里的「编译」按钮就够了，别过早引入复杂度。

真机预览是这一步的重点。点工具右上角的「预览」，会生成一个二维码。用微信扫这个二维码，就能在手机上打开你的小程序。注意：预览用的是测试号或正式 appid 对应的权限，如果扫码后提示「该小程序未上线」，说明你用的是测试号，这是正常的，测试号只能自己扫码预览。

如果预览二维码一直刷不出来，先检查网络，再检查工具是否登录了微信账号。有时候工具掉登录了，预览按钮点了没反应，重新扫码登录即可。

还有一个高频问题：真机上样式和模拟器不一致。这通常是因为模拟器默认是 iPhone 尺寸，而你手机是安卓。解决办法是在工具的「模拟器」面板里切换设备型号，多试几个尺寸，确保布局不塌。

4. 真机预览、上传代码与提审发布全流程

真机预览通过后，就可以进入发布环节。发布分三步：上传代码、设置体验版、提交审核。

第一步，上传代码。在微信开发者工具右上角点「上传」，会弹出一个窗口让你填版本号和项目备注。版本号建议用1.0.0这种语义化格式，备注写清楚这次改了什么，比如「首版：打卡页 + 历史页」。上传成功后，代码就进了微信公众平台的「开发版本」里。

这里有个硬性前提：必须使用正式 appid。测试号是没法上传的，上传按钮会提示你先绑定正式 appid。所以如果你打算发布，提前在微信公众平台注册好小程序，拿到 appid，填到 project.config.json 里。

第二步，登录微信公众平台，进入「管理」→「版本管理」。你会看到刚上传的开发版本。点「选为体验版」，生成体验版二维码。这个二维码可以发给朋友或测试人员，让他们在微信里扫码体验。体验版和正式版的区别是：体验版不需要审核，但只有被添加为体验成员的人才能扫。

第三步，提交审核。在版本管理里，点开发版本右侧的「提交审核」。提交前会要求你填写一些信息，比如功能页面路径、测试账号（如果有登录功能）。因为我们这个打卡小程序是纯本地存储，没有登录，所以测试账号可以留空。

提交后就是等审核。审核期间，你可以在「审核版本」里看到状态。审核通过后，点「发布」，小程序就正式上线了。上线后，任何人都能通过搜索或扫码打开。

发布前检查清单，我整理成下面这几条，建议逐条核对：

• app.json 里 pages 路径全部正确，无多余逗号
• project.config.json 里 appid 是正式 appid
• 所有 wx API 拼写正确，无wx.getStorage这类错误
• 本地存储的 key 命名统一，避免读写不一致
• 真机上至少完整走一遍打卡和历史修改流程
• 版本号和备注填写清晰，方便回滚
• 体验版至少让一个人扫码验证过

血的教训：做好版本管理。每次上传都写清楚版本号和备注，万一线上出问题，可以在版本管理里回滚到上一个版本。我见过有人上传时备注写「更新」，结果出问题后根本不知道回滚到哪个版本。

另外，审核被拒最常见的原因是「功能不完整」或「页面空白」。所以提交前一定要在真机上把每个页面都点一遍，确保没有白屏。

5. 常见报错排查：401、local proxy failed、reading choices 与 OAuth

虽然我们这个打卡小程序是纯本地存储，不涉及网络请求，但很多人在用 Cursor 生成代码时，会不小心引入一些需要后端或第三方服务的逻辑，这时候就会遇到下面这些报错。我把它们整理出来，方便你对照排查。

401 报错：通常出现在你调用了某个需要鉴权的接口。比如 Cursor 生成的代码里如果带了wx.request去请求某个 API，而你没配 token，就会返回 401。解决办法是检查代码里有没有wx.request，如果有，要么删掉，要么补上正确的鉴权头。纯本地存储的小程序不应该出现 401。

local proxy failed：这个报错一般和开发者工具的代理设置有关。如果你在工具里开了「代理设置」为手动，但代理地址不可用，就会报这个。解决办法是进「设置」→「代理设置」，改成「不使用任何代理」，然后重新编译。注意，这里只是工具的网络设置，不涉及任何其他操作。

reading choices：这个报错通常出现在 js 里对一个 undefined 变量取属性。比如res.data.choices但res.data是 undefined。排查方法是看报错行号，确认那个变量是否真的被赋值了。常见于 Cursor 生成的异步代码里，回调没执行就取了值。

OAuth 相关报错：如果你在代码里看到OAuth字样，说明 Cursor 可能给你生成了需要登录授权的逻辑。小程序里做登录一般用wx.login换 code，再走自己的后端。如果你没有后端，就把这段逻辑删掉，改成纯本地存储。不要在小程序里直接写 OAuth 流程，那不是小程序的常规做法。

排查这些报错的通用思路是：先看报错行号，再看那一行用了什么变量或 API，然后确认这个变量是否被正确初始化、这个 API 是否是小程序官方支持的。Cursor 可以帮你定位，但最终判断还得靠你自己对小程序 API 的熟悉程度。

如果你在接入过程中需要管理多个 key 或模型配置，可以用 TaoToken 的 API Keys 页面统一管理，地址是 https://taotoken.net/api-keys ，配合接入文档 https://taotoken.net/doc 一起看，能少走弯路。

6. 从建项到发布：把流程固化成自己的检查清单

跑通一次之后，最重要的是把流程固化下来。我自己的做法是建一个checklist.md，每次新建小程序项目就复制一份，按顺序打勾。内容就是前面那几节的核心步骤：建目录、写 app.json、导入工具、清缓存编译、真机预览、上传、设体验版、提审。

Cursor 在这个过程中扮演的是「加速器」，不是「替代品」。它能帮你快速生成页面结构和逻辑，但编译、预览、发布这些环节，必须回到微信开发者工具里完成。两者配合，效率最高。

如果你后续想接入模型能力，比如让打卡小程序支持自然语言记录，可以走 TaoToken 的模型对话接口，地址是 https://taotoken.net/models ，先在小程序里用wx.request调通，再考虑上线。长期做编码或 Agent 类项目的话，Coding Plan 会更划算，地址是 https://taotoken.net/coding-plan 。

最后给一个实用技巧：每次改完代码，先点「清缓存」再点「编译」，然后真机预览确认，最后才上传。这个顺序能帮你把问题拦在发布之前。发布不是终点，能稳定回滚才是。