关于 uni-app
uni-app 是基于 Vue.js 的跨平台框架，可用于开发移动系统、Web 和多种小程序平台的应用。此技能涵盖组件、API、配置和平台差异处理，并建议通过 uni-app 官方文档 MCP 工具查询资料。
主要功能
- 01支持 iOS、Android、HarmonyOS、Web 和小程序
- 02视图、表单、媒体与导航组件
- 03网络、存储、定位和系统 API
- 04页面与应用配置
- 05平台专属条件编译
- 06通过 MCP 工具查询官方文档
适用场景
- 01为多个列出的平台开发应用
- 02在不同目标平台使用共享组件和 API
- 03实现平台专属行为
- 04查询 uni-app API 和组件文档
MCP 相关
该技能建议使用 `search-docs-by-Uniapp-official` MCP 工具搜索官方 API 文档和示例。若工具不可用，则指向其安装项目。
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/uni-app确认已加载。
包含的文件
除 SKILL.md 外，安装时一起下载的参考资料和脚本。
GENERATION.mdreferences/config-manifest.mdconfig-pages.mdcore-form-components.mdcore-framework.mdcore-view-components.mdfeature-file-operations.mdfeature-lifecycle.mdfeature-location.mdfeature-media-components.mdfeature-navigation.mdfeature-network.mdfeature-storage.mdfeature-system-info.mdfeature-ui-feedback.md详细介绍
该技能基于 uni-app 文档生成，生成日期为 2026-01-30。
uni-app 是一个基于 Vue.js 的跨平台框架，用于开发可在 iOS、Android、HarmonyOS、Web（响应式）以及各种小程序平台（微信/支付宝/百度/抖音/飞书/QQ/快手/钉钉/淘宝/京东/小红书）上运行的应用。
核心
| 主题 | 描述 | 参考 |
|---|---|---|
| 核心框架 | 项目结构、平台支持、条件编译 | core-framework |
| 视图组件 | view、scroll-view、swiper、movable-area、cover-view | core-view-components |
| 表单组件 | input、textarea、picker、checkbox、radio、switch、slider | core-form-components |
功能
UI 组件
| 主题 | 描述 | 参考 |
|---|---|---|
| 媒体组件 | image、video、camera、live-player、map | feature-media-components |
| 导航 | navigator、路由、页面导航 | feature-navigation |
| UI 反馈 | toast、modal、loading、action sheet、下拉刷新 | feature-ui-feedback |
API
| 主题 | 描述 | 参考 |
|---|---|---|
| 网络 | HTTP 请求、文件上传/下载、WebSocket | feature-network |
| 存储 | 本地存储、文件系统、缓存 | feature-storage |
| 系统信息 | 设备信息、网络状态、屏幕、振动 | feature-system-info |
| 文件操作 | 选择图片/视频、文件系统操作 | feature-file-operations |
| 位置 | 地理定位、地图组件、地址选择 | feature-location |
| 生命周期 | 应用和页面生命周期钩子 | feature-lifecycle |
配置
| 主题 | 描述 | 参考 |
|---|---|---|
| pages.json | 页面路由、标签栏、全局样式、分包 | config-pages |
| manifest.json | 应用配置、权限、平台设置 | config-manifest |
平台支持
| 平台 | 支持级别 |
|---|---|
| iOS 应用 | 完全支持 |
| Android 应用 | 完全支持 |
| HarmonyOS Next | 完全支持 |
| H5/Web | 完全支持 |
| 微信小程序 | 完全支持 |
| 支付宝小程序 | 完全支持 |
| 百度智能小程序 | 完全支持 |
| 抖音小程序 | 完全支持 |
| QQ 小程序 | 完全支持 |
| 快手小程序 | 完全支持 |
| 飞书小程序 | 完全支持 |
| 京东小程序 | 完全支持 |
| HarmonyOS 元服务 | 完全支持 |
核心概念
条件编译
使用特殊注释编写特定平台的代码：
<view>App only</view>
<view>WeChat only</view>
API Promise 支持
大多数 uni-app API 在未提供回调时支持 Promise：
const res = await uni.request({ url: 'https://api.example.com' })
跨平台最佳实践
- 使用 uni-app 组件和 API，而非特定平台的组件和 API
- 使用条件编译实现特定平台的功能
- 在所有目标平台上进行测试
- 使用 rpx 实现响应式布局
- 在 manifest.json 中处理平台差异
- 必须使用 uni-helper 工具
MCP 扩展
需要查询 uni-app 官方文档时，优先调用 search-docs-by-Uniapp-official MCP 工具搜索相关 API 文档和使用示例。
使用场景：
- 用户询问特定 API 的详细用法
- 需要官方文档中的代码示例
- 查询组件的属性和事件
- 了解 API 的平台兼容性
工具安装： 如果检测到该 MCP 工具不可用，请引导用户访问 https://github.com/uni-helper/mcp 进行安装。
评论
支持 Markdown