更新记录

1.0.0-alpha.5(2023-08-21) 下载此版本

✨ feat(button):适配微信开放能力

1.0.0-alpha.4(2023-08-10) 下载此版本

**

1.0.0-alpha.1-1(2023-08-08) 下载此版本

更新 readme

查看更多

平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
× × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

iui Design

基于 Uni-app 的 Vue3 UI 组件库。

iui Design

简介

iui Design 是一款基于 uni-app 的前端组件库,它提供了一套可复用、易扩展、低耦合的移动端 UI 组件库,帮助开发者快速搭建移动应用。

设计灵感来自 ArcoDesign,感谢巨人!

预览

请扫描右侧小程序码或微信搜索小程序 iui Design 进行体验。

移动端 H5:预览地址

文档

文档地址

如果你喜欢这个组件库,欢迎给我们点一个 ⭐ Star

交流反馈

iui Design 交流群

版权信息

iui Design 遵循 Apache-2.0 开源协议,意味着您无需支付任何费用,也无需授权,即可将 iui Design 应用到您的产品中。

这并不意味着您可以将 iui Design 应用到非法的领域,比如涉及赌博,暴力等方面。如因此产生纠纷或法律问题,iui Design 相关方及云磁数字不承担任何责任。

安装

使用前,请确保你已经学习过 uni-app 的使用,你可以阅读 uni-app 文档

组件库

方式一:通过 npm 安装

npm i iui-design
# or
yarn add iui-design

方式二:通过 HBuilderX 导入

如果您是使用 HbuilderX 开发的用户,您可以在 uni-app 插件市场通过 uni_modules 的形式进行安装。

Scss 插件

iui-design 依赖 sass,您必须要安装此插件,否则无法正常运行。

  • 如果您使用的是 HbuilderX,您可以在 插件市场 中搜索 sass 进行安装。
  • 如果您的项目是由 vue-cli 创建的,请通过以下命令安装对 sass(scss)的支持,如果已安装,请略过。
# 安装sass
npm i sass -D

# 安装sass-loader
npm i sass-loader -D

配置

引入样式

App.vue 中引入 iui-design 的样式。

<style lang="scss">
// npm 模式安装
@import "iui-design/style/index.scss";

// HBuilderX 插件市场安装
@import "@/components/iui-design/style/index.scss";
</style>

uni.scss 中引入 iui-design 的主题样式和变量。

// npm 模式安装
@import "iui-design/style/theme.scss";

// HBuilderX 插件市场安装
@import "@/components/iui-design/style/theme.scss";

easycom 模式

iui-design 支持 easycom 模式,您可以在 pages.json 中配置 easycom,然后无需引入即可使用组件。

npm 模式安装:

{
  "easycom": {
    "custom": {
      "^iui-(.*)": "iui-design/components/iui-$1/iui-$1.vue"
    }
  }
}

HBuilderX 插件市场安装:

{
  "easycom": {
    "custom": {
      "^iui-(.*)": "@/components/iui-design/components/iui-$1/iui-$1.vue"
    }
  }
}

贡献指南

感谢你使用 iui Design

以下是关于向 iui Design 提交反馈或代码的指南。在向 iui Design 提交 issue 或者 PR 之前,请先花几分钟时间阅读以下内容。

提交 issue

  • 遇到问题时,请先确认这个问题是否已经在 issue 中有记录或者已被修复。
  • 提 issue 时,请用简短的语言描述遇到的问题,并添加出现问题时的环境和复现步骤。

参与开发

我们非常乐意接受各位的优质 PR,但在此之前我希望您了解 iui Design 是一个需要兼容多个平台的组件库。 所以希望在您修复 bug 并提交之前尽可能的去这些平台测试一下兼容性。最好能携带测试截图以方便审核。非常感谢!

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问