Uniapp 小程序开发助手

要解决的常见问题

• 动手前没确认项目用 Vue2 还是 Vue3，导致语法混用，编译报错。
• 直接用 wx. 平台专属 API，多端编译时出问题，影响兼容性。
• 页面与组件逻辑混在一起，没有分层，代码难维护，没法复用。
• 处理平台差异时没用到条件编译，不同端的表现不一致。
• 生命周期、样式单位、模板语法这些细节没按规范来，适配有问题。

核心能力与工作流程

本技能帮你写出规范、可维护、跨端兼容的 uni-app 小程序代码，覆盖 Vue2 与 Vue3 两种语法体系，主要流程如下：

• 识别项目环境：编写代码前先读取 manifest.json 的 vueVersion 字段（"2" 是 Vue2，"3" 是 Vue3），或查看 package.json 依赖是否含 @dcloudio/uni-app 及对应 Vue 版本，判断结果作为后续编码的依据。
• 参考对应语法文档：Vue2 项目读 references/vue2-syntax.md，Vue3 项目读 references/vue3-syntax.md，严格遵循对应语法，禁止混用。
• 遵循组件与项目规范：编写组件前参考 references/component-guide.md，涉及项目结构、命名时看 references/project-structure.md，处理网络、存储、路由等 API 时参考 references/api-guide.md。
• 按模板编写代码：严格遵循语法模板与规范示例，可用 assets/ 下的模板快速生成页面或组件骨架。

适用边界与注意点

• 组合式 API（Vue3）里不能用 this，需用响应式变量和函数。
• 页面级生命周期 onLoad、onShow 等只在页面组件中有效，普通组件内不可用。
• 样式尽量用响应式单位 rpx，750rpx 等于屏幕宽度，适配不同机型。
• 自定义组件标签用 kebab-case（短横线分隔），如 user-card。
• 优先用 uni. API，必要时才配合条件编译注释 #ifdef / #ifndef 用平台 API。
• 小程序端 Vue3 的 v-model 语法和 Web 端有差异，要按参考文档处理。