mcpField
U
uni-app

uni-app

github.com/uni-helperDevelopment1102.0k installsUpdated 39w ago
Repository

About uni-app

uni-app is a Vue.js-based cross-platform framework for building apps for mobile operating systems, web, and mini-program platforms. This skill covers its components, APIs, configuration, and platform-specific development; it also directs documentation queries to the uni-app official-docs MCP tool.

Key features

  1. 01iOS, Android, HarmonyOS, web, and mini-program targets
  2. 02View, form, media, and navigation components
  3. 03Network, storage, location, and system APIs
  4. 04Page and app configuration
  5. 05Platform-specific conditional compilation
  6. 06Official documentation lookup via MCP tool

Use cases

  1. 01Building an app for multiple listed platforms
  2. 02Using shared components and APIs across targets
  3. 03Implementing platform-specific behavior
  4. 04Looking up uni-app API and component documentation

MCP support

The skill recommends the `search-docs-by-Uniapp-official` MCP tool to search official API documentation and examples. If unavailable, it points users to the installation project.

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/uni-helper/skills --skill uni-app

After installing, type/uni-appin Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

GENERATION.md
references/
config-manifest.md
config-pages.md
core-form-components.md
core-framework.md
core-view-components.md
feature-file-operations.md
feature-lifecycle.md
feature-location.md
feature-media-components.md
feature-navigation.md
feature-network.md
feature-storage.md
feature-system-info.md
feature-ui-feedback.md

Details

From the project README

The skill is based on uni-app documentation, generated at 2026-01-30.

uni-app is a Vue.js-based cross-platform framework for developing applications that run on iOS, Android, HarmonyOS, Web (responsive), and various mini-program platforms (WeChat/Alipay/Baidu/Douyin/Feishu/QQ/Kuaishou/DingTalk/Taobao/Jingdong/Xiaohongshu).

Core

TopicDescriptionReference
Core FrameworkProject structure, platform support, condition compilationcore-framework
View Componentsview, scroll-view, swiper, movable-area, cover-viewcore-view-components
Form Componentsinput, textarea, picker, checkbox, radio, switch, slidercore-form-components

Features

UI Components
TopicDescriptionReference
Media Componentsimage, video, camera, live-player, mapfeature-media-components
Navigationnavigator, routing, page navigationfeature-navigation
UI Feedbacktoast, modal, loading, action sheet, pull refreshfeature-ui-feedback
APIs
TopicDescriptionReference
NetworkHTTP requests, file upload/download, WebSocketfeature-network
StorageLocal storage, file system, cachingfeature-storage
System InfoDevice info, network status, screen, vibrationfeature-system-info
File OperationsImage/video selection, file system operationsfeature-file-operations
LocationGeolocation, map component, address selectionfeature-location
LifecycleApp and page lifecycle hooksfeature-lifecycle

Configuration

TopicDescriptionReference
pages.jsonPage routing, tab bar, global styles, sub-packagesconfig-pages
manifest.jsonApp config, permissions, platform settingsconfig-manifest

Platform Support

PlatformSupport Level
iOS AppFull support
Android AppFull support
HarmonyOS NextFull support
H5/WebFull support
WeChat Mini ProgramFull support
Alipay Mini ProgramFull support
Baidu Smart ProgramFull support
Douyin Mini ProgramFull support
QQ Mini ProgramFull support
Kuaishou Mini ProgramFull support
Feishu Mini ProgramFull support
JD Mini ProgramFull support
HarmonyOS Meta ServiceFull support

Key Concepts

Condition Compilation

Use special comments to write platform-specific code:

<!-- #ifdef APP-PLUS -->
<view>App only</view>
<!-- #endif -->

<!-- #ifdef MP-WEIXIN -->
<view>WeChat only</view>
<!-- #endif -->
API Promise Support

Most uni-app APIs support Promise when no callback is provided:

const res = await uni.request({ url: 'https://api.example.com' })
Cross-Platform Best Practices
  1. Use uni-app components and APIs instead of platform-specific ones
  2. Use condition compilation for platform-specific features
  3. Test on all target platforms
  4. Use rpx for responsive layouts
  5. Handle platform differences in manifest.json
  6. must use uni-helper tools
MCP扩展

当需要查询 uni-app 官方文档时,优先调用 search-docs-by-Uniapp-official MCP 工具搜索相关 API 文档和使用示例。

使用场景:

  • 用户询问特定 API 的详细用法
  • 需要官方文档中的代码示例
  • 查询组件的属性和事件
  • 了解 API 的平台兼容性

工具安装: 如果检测到该 MCP 工具不可用,引导用户访问 https://github.com/uni-helper/mcp 进行安装。

Comments

Markdown supported