微信小程序从零到上线助手
Overview
Guide the user through the full lifecycle of a WeChat Mini Program: understanding the architecture → scaffolding a runnable project → developing pages (including Canvas 2D) → debugging common errors → setting up AppID / accounts → submitting for review → releasing. Apply the bundled procedural knowledge and reusable assets so the user ends up with a real, runnable project rather than just an explanation.
When To Use
- User says "做个小程序 / 微信小程序 / 小程序助手 / 小程序模板".
- User hits a mini program error (e.g., 无效的 app.json window["disableScroll"],
ReferenceError: ctx is not defined, 卡顿/掉帧). - User asks about 发布 / 上线 / 体验权限 / AppID / 测试号 / 审核.
- User wants a boilerplate mini program project to start from.
Workflow
1. Clarify scope (only if unclear)
Determine: target device (phone only / also need 管理后台?), must-have pages, whether a backend is needed (wx.request to own server), and whether payment/login is required. If the user just wants to start, skip straight to scaffolding.
2. Scaffold a runnable project
Run the bundled scaffolder to generate a complete, importable project:
python <skill>/scripts/scaffold_miniprogram.py <target_dir> [--appid APPID] [--name NAME]
This creates app.js / app.json / app.wxss / project.config.json / sitemap.json and pages/index/* (the four-file set). The user imports the folder into 微信开发者工具 (WeChat DevTools) and can preview immediately. Then customize pages per the request.
3. Develop pages and logic
Consult references/architecture-and-basics.md for:
- Dual-thread architecture (逻辑层 AppService vs 视图层 WebView).
- The four-file page structure and how they interact.
rpxunits, data binding{{ }},bindtapevents.setDatamechanics and its size/performance limits.- Page/App lifecycle.
- Canvas 2D (
type="2d"+SelectorQuery+requestAnimationFrame+ dpr). wx.requestand the domain whitelist gotcha.
4. Debug common errors
Consult references/common-pitfalls.md for the exact fixes to:
- 无效的 app.json window["disableScroll"] (only valid at page-level json).
ctx is not definedinside Canvas drawing (captureconst ctx = canvas.getContext('2d')).- 卡顿/掉帧 (drop
shadowBlur, cap dpr at 2, cache measured text widths, limit particle count). - "暂无体验权限" on QR preview (test accounts have no experience-member entry; needs official AppID + 体验成员 added in backend).
5. Publish and release
Consult references/publishing.md for:
- Test account (
touristappid) vs official AppID trade-offs. - Where to set/change the AppID (project.config.json
appidfield or DevTools 详情). - How to add 体验成员 so others can preview.
- The upload → 提交审核 → 发布 pipeline, plus personal vs enterprise account limits.
Resources
scripts/scaffold_miniprogram.py— generate a runnable boilerplate project.references/architecture-and-basics.md— architecture, four-file structure, rpx, setData, lifecycle, Canvas 2D, network.references/common-pitfalls.md— error catalog with exact fixes.references/publishing.md— AppID, accounts, experience members, review/release flow.
Notes
- Prefer native WeChat mini program (WXML/WXSS/JS/JSON), zero-dependency, runs directly in DevTools.
- When generating code, keep it minimal and runnable; avoid features the user did not ask for.
- For visual effects (particles, fireworks), use Canvas 2D with the performance rules in
common-pitfalls.md.
