跪拜 Guibai
← All articles
Frontend · Uni-app · AI Programming

uView Pro X 1.0.0 Brings 80+ Native-Rendered Components to uni-app x's Vapor Mode

By 前端梦工厂 ·
Read original on juejin.cn ↗ Google Translate ↗ Alt translation

The uni-app x ecosystem has few ready-made UI libraries and even fewer tuned for Vapor mode's native rendering. uView Pro X fills that gap with typed components, built-in theming and i18n, plus AI assistant integration—so teams migrating to uni-app x can skip assembling a component layer from scratch.

Summary

uView Pro X 1.0.0 ships as the uni-app x edition of the uView Pro library, rewritten from scratch to run on Vapor mode—uni-app x's native rendering path that compiles template and style into bytecode. The App side no longer relies on a virtual DOM; UTS code runs through the `uts2js` compiler along with page logic. The library covers seven component categories—base, form, data, feedback, layout, navigation, and other—totaling over 80 components across 61 example pages.

The release bundles core features that typically require separate configuration: a token-driven theming system with persistent theme selection, dark mode that can follow the system or toggle manually, and built-in Chinese and English locales with custom language pack support. Components are written in UTS with full type definitions for props, events, and slots, and the library enforces Vapor's constraints—Composition API only, no mixins, simple class selectors, and no pseudo-elements or CSS `gap`. It also ships an Agent Skills package for AI coding assistants, giving them API cards and a validator script to avoid guessing component APIs.

Platform support covers Android, iOS, HarmonyOS, H5, and WeChat Mini-programs, with Vapor mode required on App platforms (HBuilderX 5.21+ on Android, 5.11+ on iOS, 5.0+ on HarmonyOS). Installation goes through the DCloud plugin marketplace only—no npm—and components are compiled on demand via easycom to keep build size down.

Takeaways
— uView Pro X 1.0.0 provides over 80 components across seven categories with 61 matching example pages.
— The library runs on Vapor mode for App platforms, compiling template and style to bytecode and using UTS code converted to JS via uts2js.
— Supported platforms include App-Android, App-iOS, App-HarmonyOS, H5, and WeChat Mini-programs.
— Built-in theming uses color tokens that write to both `color` and CSS variables, with persistent theme selection under key `uview-pro-x-theme`.
— Dark mode can follow system (auto), light, or dark, with persisted settings under a separate key.
— Built-in language packs are `zh-CN` and `en-US`, persisted via `uview-pro-x-locale`, with extensible custom packs.
— Components are written in UTS and expose typed definitions for props, events, and slots; UTS pages get compile-time validation.
— Vapor mode imposes constraints: only Composition API, no mixins, simple class selectors, no pseudo-elements, and no CSS `gap` on App.
— The Agent Skills package includes API cards for 77 components, three-platform compatibility checks, and a `verify-ux-usage.mjs` validator; works with Qoder, Claude Code, Cursor, and Trae.
— Installation is only via DCloud plugin marketplace into the `uni_modules/uview-pro-x` directory, not npm.
— Components are compiled on demand through easycom, so unused components are excluded from the build.
Conclusions

Shipping an Agent Skills package alongside the component library is a practical recognition that AI coding assistants now drive a significant share of UI code—the validator script directly prevents the hallucinated property names that plague LLM-generated uni-app code.

The strict Vapor constraints (no pseudo-elements, no CSS `gap`, only Composition API) force a rewrite of UI patterns that most web developers take for granted, and the library's internal workarounds show what a production component set must sacrifice to reach native rendering on uni-app x.

Restricting installation to the DCloud plugin marketplace keeps the library out of standard npm workflows, which may widen the gap between uni-app x and broader cross-platform tooling ecosystems.

The version matrix for HBuilderX (5.21+ Android, 5.11+ iOS, 5.0+ HarmonyOS) indicates Vapor mode is still evolving per platform, so component consumers must track toolchain upgrades closely.

Concepts & terms
Vapor mode (蒸汽模式)
uni-app x's compilation mode for App platforms where `template` and `style` are compiled into bytecode that directly drives native UI nodes, skipping the virtual DOM. Logic runs on a JS engine, and UTS code is converted to JS via `uts2js`.
UTS
A TypeScript-like language used in uni-app x for writing logic that can run natively on App platforms. It offers stronger type checking at compile time compared to plain TS when used in `<script setup lang="uts">` blocks.
easycom
A uni-app feature that automatically scans and imports `ux-*` components configured in `pages.json`, ensuring only used components are included in the final bundle and reducing package size.
Agent Skills
A package format for AI coding assistants (e.g., Claude Code, Cursor) that provides contextual API documentation and validation scripts. Here it includes 77 component API cards and a `verify-ux-usage.mjs` script to catch property/event misuse.
Source: juejin.cn ↗ Google Translate ↗ Backup ↗