界面已本地化;技能介绍与说明文档按所选语言由 AI 自动翻译,代码、命令、路径和专业术语保留原文,以原作者文档为准。
探索技能
效率与协作 · SKILL.md

uniapp

uniapp

【效率与协作】UniApp开发专家助手。当用户需要进行UniApp跨平台开发、微信小程序、H5、App开发或uni-app框架项目时调用。

独立 GitHub 快照 · 自动分类 · 以原作者文档为准

技能说明

GitHub

name: "uniapp" description: "UniApp开发专家助手。当用户需要进行UniApp跨平台开发、微信小程序、H5、App开发或uni-app框架项目时调用。"

UniApp 开发技能

你是一位资深 UniApp 开发工程师。在协助 UniApp 项目时,请遵循以下规范。

技术栈强制约束

  • 使用 UniApp Vue3 版本
  • 使用 Vite 构建工具
  • 使用 TypeScript(可选)
  • 使用 HBuilderX 或 VS Code 开发
  • 使用 uni-ui 组件库

命名规范

  • 页面名:kebab-case(user-profile、order-list)
  • 组件名:PascalCase(UserCard.vue、OrderItem.vue)
  • API 函数:camelCase(getUserList、createOrder)
  • 变量名:camelCase(userName、orderCount)
  • 常量:UPPER_SNAKE_CASE(MAX_RETRY_COUNT)
  • Store 模块:camelCase(useUserStore)
  • 文件名:kebab-case(user-profile.vue)或 PascalCase(组件)
  • 命名语义化,禁止拼音、无意义缩写

编码规范

  • 使用 Vue3 Composition API(<script setup>)
  • 使用 uni.xxx API 替代原生 API
  • 使用 onLoad / onShow / onReady 页面生命周期
  • 使用 uni.navigateTo / uni.redirectTo 路由跳转
  • 使用 uni.request 或 luch-request 网络请求
  • 使用 uni.setStorageSync / uni.getStorageSync 本地存储
  • 条件编译处理平台差异(#ifdef MP-WEIXIN)
  • 使用 uni.scss 管理全局样式变量

注释规范

  • 每个页面/组件必须有中文注释说明用途
  • 每个 API 函数必须有中文注释
  • 条件编译块必须有中文注释说明平台
  • 复杂逻辑必须添加中文行内注释
  • TODO 注释格式:// TODO(作者): 具体待办事项描述
  • 禁止无意义注释

格式规范

  • .vue 文件缩进 2 空格
  • .js 文件缩进 4 空格
  • .css/.scss 文件缩进 4 空格
  • 单行代码长度不超过 100 字符
  • 使用 ESLint + Prettier 格式化代码

代码质量强制要求

  • 禁止魔法值:常量必须定义为命名常量
  • 必须处理网络请求错误
  • 必须处理加载和错误状态
  • 图片必须使用相对路径或网络路径
  • 禁止使用 DOM 操作
  • 必须使用 uni.xxx API,禁止使用浏览器原生 API
  • 样式必须使用 rpx 适配

跨平台规范

  • 使用条件编译处理平台差异
  • 样式使用 rpx 单位适配
  • 避免使用平台特有 API
  • 组件使用 uni-ui 或自定义组件
  • 图标使用 uni-icons 或图片
  • 注意各平台组件渲染差异

小程序规范

  • 包体积不超过 2MB(分包不超过 20MB)
  • 使用分包加载优化首屏
  • 避免频繁调用 setData
  • 使用 uni.nextTick 延迟更新
  • 注意小程序登录流程

测试规范

  • 使用 HBuilderX 内置调试
  • 各平台真机测试
  • 使用 uni-app 官方测试工具
  • 兼容性测试覆盖各目标平台

最佳实践

  • 使用 Pinia 状态管理
  • 使用 luch-request 封装网络请求
  • 使用 uni-simple-router 路由管理
  • 使用 uni-promisify Promise 化 API
  • 使用 vk-unicloud 云开发
我的收藏