背景知识

使用 ava-ui 前，请确保已经学习过微信官方的 小程序简易教程 和 自定义组件介绍。

安装

查看源，确保为firstshare，否则需要设置

npm get registry

设置源

npm config set registry https://registry-npm.firstshare.cn

使用npm安装ava-ui库

npm i ava-ui -D

使用组件

以按钮组件为例，只需要在 JSON 文件中引入按钮对应的自定义组件即可

{
  "usingComponents": {
    "ava-button": "ava-ui/package/fxui/Button/Button"
  }
}

接着就可以在 wxml 中直接使用组件

<ava-button text="default">按钮</ava-button>

开发者工具预览

ava-ui可以在开发者工具中预览示例小程序

# 将项目克隆到本地
git clone https://git.firstshare.cn/fs-hera/ava_ui

# 安装项目依赖
cd ava_ui && npm install

# 执行组件编译
npm run dev

打开微信开发者工具，把ava_ui目录添加进去就可以预览示例了。

打开预览