uniappx-uview-pro
Integrates uView Pro component library into UniAppX (uni-app-x) projects with TypeScript and Composition API, including easycom configuration, pages.json and manifest.json setup, and platform-specific handling. Use when the user needs to add uView Pro components to a UniAppX project, configure TypeScript .uts integration, or handle cross-platform styling.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/uniappx-uview-pro/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How uniappx-uview-pro Compares
| Feature / Agent | uniappx-uview-pro | Standard Approach |
|---|---|---|
| Platform Support | multi | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Integrates uView Pro component library into UniAppX (uni-app-x) projects with TypeScript and Composition API, including easycom configuration, pages.json and manifest.json setup, and platform-specific handling. Use when the user needs to add uView Pro components to a UniAppX project, configure TypeScript .uts integration, or handle cross-platform styling.
Which AI agents support this skill?
This skill is compatible with multi.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
## When to use this skill Use this skill whenever the user wants to: - Integrate uView Pro into UniAppX projects - Configure UniAppX projects to work with uView Pro (pages.json, manifest.json, easycom) - Handle platform-specific behaviors when using uView Pro in UniAppX (H5, mini-program, App, nvue) - Use UniAppX features (navigation, APIs, lifecycle) with uView Pro components - Build cross-platform UniAppX applications with uView Pro components - Configure easycom for automatic uView Pro component import in UniAppX - Handle navigation and routing with uView Pro in UniAppX - Optimize UniAppX projects using uView Pro - Deploy uView Pro-based UniAppX applications to multiple platforms ## How to use this skill This skill is organized to match UniAppX integration patterns and the official UniAppX plugin structure (https://ext.dcloud.net.cn/plugin?id=24633). When working with uView Pro in UniAppX: 1. **Install and setup** uView Pro in UniAppX project: - Load `examples/getting-started/installation.md` for installation in UniAppX - Load `examples/getting-started/project-setup.md` for UniAppX project configuration - Load `examples/getting-started/easycom-config.md` for easycom configuration 2. **Integrate with UniAppX features**: - Load `examples/integration/pages-config.md` for pages.json configuration - Load `examples/integration/manifest-config.md` for manifest.json configuration - Load `examples/integration/navigation.md` for navigation with uView Pro - Load `examples/integration/uniappx-api.md` for using UniAppX APIs with uView Pro 3. **Handle platform-specific behaviors**: - Load `examples/platform-specific/h5.md` for H5 platform considerations - Load `examples/platform-specific/miniprogram.md` for mini-program considerations - Load `examples/platform-specific/app.md` for App platform considerations - Load `examples/platform-specific/nvue.md` for nvue considerations 4. **Advanced integration**: - Load `examples/advanced/custom-theme.md` for theme customization in UniAppX - Load `examples/advanced/build-optimization.md` for build optimization - Load `examples/advanced/multi-platform.md` for multi-platform deployment 5. **Reference the API documentation** when needed: - `api/integration-api.md` - UniAppX and uView Pro integration API - `api/config-api.md` - Configuration API reference 6. **Use templates** for quick start: - `templates/basic-uniappx-project.md` - Basic UniAppX project with uView Pro - `templates/pages-template.md` - Pages configuration template - `templates/manifest-template.md` - Manifest configuration template **Important Notes**: - This skill focuses on UniAppX integration, not uView Pro API documentation - UniAppX uses TypeScript (.uts files) and Composition API (setup syntax) - Always configure easycom in pages.json for automatic component import - Use conditional compilation (`#ifdef`, `#endif`) for platform-specific code - Test on all target platforms (H5, mini-programs, App) before deployment - Use rpx units for responsive sizing in UniAppX ## Examples and Templates ### Getting Started - **Installation**: `examples/getting-started/installation.md` - How to install uView Pro in UniAppX projects - **Project Setup**: `examples/getting-started/project-setup.md` - Setting up UniAppX project with uView Pro - **Easycom Config**: `examples/getting-started/easycom-config.md` - Configuring easycom for automatic component import ### Integration - **Pages Config**: `examples/integration/pages-config.md` - Configuring pages.json with uView Pro - **Manifest Config**: `examples/integration/manifest-config.md` - Configuring manifest.json for uView Pro - **Navigation**: `examples/integration/navigation.md` - Navigation and routing with uView Pro - **UniAppX API**: `examples/integration/uniappx-api.md` - Using UniAppX APIs with uView Pro components ### Platform-Specific - **H5**: `examples/platform-specific/h5.md` - H5 platform considerations with uView Pro - **Mini-Program**: `examples/platform-specific/miniprogram.md` - Mini-program considerations with uView Pro - **App**: `examples/platform-specific/app.md` - App platform considerations with uView Pro - **nvue**: `examples/platform-specific/nvue.md` - nvue considerations with uView Pro ### Advanced - **Custom Theme**: `examples/advanced/custom-theme.md` - Customizing themes in UniAppX projects - **Build Optimization**: `examples/advanced/build-optimization.md` - Optimizing UniAppX builds with uView Pro - **Multi-Platform**: `examples/advanced/multi-platform.md` - Multi-platform deployment strategies ### Templates - **Basic Project**: `templates/basic-uniappx-project.md` - Basic UniAppX project structure with uView Pro - **Pages Template**: `templates/pages-template.md` - pages.json configuration template - **Manifest Template**: `templates/manifest-template.md` - manifest.json configuration template ## API Reference - **Integration API**: `api/integration-api.md` - UniAppX and uView Pro integration API reference - **Config API**: `api/config-api.md` - Configuration API reference for UniAppX projects ## Best Practices 1. **Use easycom**: Configure easycom in pages.json for automatic uView Pro component import 2. **Platform Testing**: Test on all target platforms (H5, mini-programs, App) before deployment 3. **Use rpx Units**: Use rpx for responsive sizing in UniAppX, px for fixed sizes 4. **SCSS Support**: Ensure SCSS is properly configured in UniAppX project 5. **Manifest Configuration**: Properly configure manifest.json for each platform 6. **Conditional Compilation**: Use conditional compilation (`#ifdef`, `#endif`) for platform-specific code 7. **Performance**: Optimize for each platform's specific requirements 8. **TypeScript**: Use TypeScript (.uts files) and proper type definitions 9. **Composition API**: Use Composition API and setup syntax (recommended for UniAppX) 10. **Lifecycle Management**: Properly handle UniAppX page lifecycle with uView Pro components ## Resources - **Official UniAppX Plugin**: https://ext.dcloud.net.cn/plugin?id=24633 - **UniAppX Documentation**: https://uniapp.dcloud.net.cn/uni-app-x/ - **UniAppX API Reference**: https://uniapp.dcloud.net.cn/uni-app-x/api/ ## Keywords uniappx, uniapp-x, uview-pro, uview pro, uniappx integration, uniappx configuration, easycom, pages.json, manifest.json, uni-app-x, 小程序, 跨平台, H5, App, nvue, 条件编译, 平台差异, TypeScript, Composition API, setup 语法, .uts 文件, UniAppX 组件, 跨平台组件, 小程序组件, App 组件