推荐一款由支付宝小程序官方推出的免费开源UI组件库——Ant Design Mini

Ant Design Mini，又称 antd-mini，是在支付宝小程序上运行的 UI 组件库。它的 UI 设计严格遵循 Ant Design 的规范，现已正式加入 Ant Design 生态，成为官方的 UI 组件库。

Ant Design Mini免费开源说明

Ant Design Mini 是由支付宝小程序官方开发并且维护的小程序 UI 组件库，项目采用 MIT 开源协议，我们可以免费下载来使用，可以自由地使用在商业项目上。

Ant Design Mini特性

1、高性能：不需要配置，自动优化最佳的包体积大小，组件的运行也达到了极佳的性能；

2、支持定制外观和主题：可以高效地对组件外观进行调整或创造自己的主题；

3、原子化：恰到好处的组件的功能，不多也不少；

4、手机端操作流畅：拥有流畅的手势和细腻的动画，让开发者很容易打造出极致的用户体验。

Ant Design Mini 目前拥有超过30个通用的基础组件，涵盖导航、提示、信息展示、信息输入和反馈五大类别。这些组件均源自蚂蚁集团旗下的众多移动端业务，例如支付宝和网商银行。经过设计师的精心改进，这些组件不仅符合 Ant Design 的设计标准，还能满足大部分开发需求。

Ant Design Mini开发上手体验

1. npm 安装

Ant Design Mini 是一套运行在支付宝小程序中的组件库，安装很简单：

npm i antd-mini --save

2. 开启 component2

从 2.11.0 版本起，需要开启 component2，开启后自定义组件会使用新的生命周期运行模式。开启方法：在支付宝小程序 IDE 中的 详情 > 项目配置 中，勾选 启用 component2 编译。

3. 在页面 json 文件中引入组件

{
  "usingComponents": {
    "ant-button": "antd-mini/es/Button/index"
  }
}

4. 在 axml 文件中使用

<ant-button>点击按钮</ant-button>

更详细的组件使用方法可以查看官网的文档，非常简单，如果有 Vue.js 或者是微信小程序的基础，直接可以上手使用。

进入Ant Design Mini官网