Vant Weapp

Vant Weapp 是有赞移动端组件库 Vant 的微信小程序版本，两者基于相同的视觉规范，提供一致的 API 接口，助力开发者快速搭建小程序应用。

特性

• 🚀 70+ 个高质量组件，覆盖移动端主流场景
• 🚀 使用 TypeScript 编写，提供完整的类型定义
• 🚀 零外部依赖，不依赖三方 npm 包
• 💪 支持主题定制，内置 700+ 个主题变量
• 💪 支持暗黑模式
• 💪 支持国际化，内置 30+ 种语言包
• 📖 提供丰富的中英文文档和组件示例
• 🍭 支持 npm 构建模式和原生构建模式

安装

方式一：通过 npm 安装（推荐）

# 通过 npm 安装
npm i @vant/weapp -S --production

# 通过 yarn 安装
yarn add @vant/weapp --production

# 通过 pnpm 安装
pnpm add @vant/weapp --production

方式二：下载代码

直接通过 git 下载 Vant Weapp 源代码，并将 dist 目录拷贝到自己的项目中。

git clone https://github.com/youzan/vant-weapp.git

使用组件

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

{
  "usingComponents": {
    "van-button": "@vant/weapp/button/index"
  }
}

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

<van-button type="primary">按钮</van-button>

在线体验

可以通过微信扫描下方小程序码体验组件库示例：

[小程序码图片]

链接

• 官方文档
• GitHub