特性

• 多平台覆盖，支持微信小程序、支付宝小程序、H5、APP 等
• 使用 TypeScript 构建，提供良好的组件类型系统
• 支持国际化
• 支持修改 CSS 变量实现主题定制
• 支持暗黑模式

快速上手

详细说明见 快速上手。

安装

pnpm add uni-ui-plus

引入主题样式

在 App.vue 中全局引入主题样式，否则组件的间距、颜色等 CSS 变量无法生效：

<!-- App.vue -->
<style lang="scss">
@use 'uni-ui-plus/styles/theme/index.scss';
</style>

配置

方案 1：vite 自动引入

pnpm add @uni-helper/vite-plugin-uni-components -D

// vite.config.ts
import Components from '@uni-helper/vite-plugin-uni-components'
import { UpResolver } from 'uni-ui-plus'

export default defineConfig({
  plugins: [
    Components({ resolvers: [UpResolver()] }),
    uni()
  ],
});

方案 2：easycom

// pages.json
{
  "easycom": {
    "autoscan": true,
    "custom": {
      "^up-(.*)": "uni-ui-plus/components/up-$1/up-$1.vue"
    }
  }
}

Volar 支持

// tsconfig.json
{
  "compilerOptions": {
    "types": ["uni-ui-plus/global"]
  }
}

开源协议

本项目基于 MIT 协议。