A lightweight, customizable Vue UI library for mobile web apps.
Documentation · Documentation (backup) · 中文介绍
Using npm to install:
# install latest Vant for Vue 3 project
npm i vant
# install Vant 2 for Vue 2 project
npm i vant@latest-v2
Using yarn, pnpm, or bun:
# with yarn
yarn add vant
# with pnpm
pnpm add vant
# with Bun
bun add vant
It is recommended to use Rsbuild to create a scaffold project.
Rsbuild is a build tool based on Rspack, developed by the author of Vant, with first-class build speed and development experience, providing first-priority support for Vant.
You can create a Rsbuild project with the following command:
npm create rsbuild@latest
Please visit the Rsbuild repository for more information.
import { createApp } from 'vue';
// 1. Import the components you need
import { Button } from 'vant';
// 2. Import the components style
import 'vant/lib/index.css';
const app = createApp();
// 3. Register the components you need
app.use(Button);
See more in Quickstart.
Vant 2 supports modern browsers and Android >= 4.0、iOS >= 8.0.
Vant 3/4 supports modern browsers and Chrome >= 51、iOS >= 10.0 (same as Vue 3).
| Project | Description |
|---|---|
| vant-weapp | WeChat MiniProgram UI |
| vant-demo | Collection of Vant demos |
| vant-cli | Scaffold for UI library |
| vant-icons | Vant icons |
| vant-touch-emulator | Using vant in desktop browsers |
| vant-nuxt | Vant module for Nuxt |
| Project | Description |
|---|---|
| 3lang3/react-vant | React mobile UI Components based on Vant |
| vant-aliapp | Alipay MiniProgram UI |
| vant-theme | Online theme preview built on Vant UI |
| @antmjs/vantui | Mobile UI Components based on Vant, supporting Taro and React |
| vant-playground | Vant Playground |
| sfc-playground-vant | Vant Playground |
| vue3-h5-template | Mobile project template based on Vant |
| vue3-vant-mobile | Mobile project template based on Vant |
| vscode-common-intellisense | A VS Code extension that provides better intellisense to Vant developers |
You can scan the following QR code to access the demo：
Core contributors of Vant and Vant Weapp:
 |  |  |  |  |  |
|---|---|---|---|---|---|
| chenjiahan | cookfront | wangnaiyi | pangxie | rex-zsd | nemo-shen |
 |  |  |  |  |  |
|---|---|---|---|---|---|
| Lindysen | JakeLaoyu | landluck | wjw-gavin | inottn | zhousg |
Thanks to the following friends for their contributions to Vant:
Please make sure to read the Contributing Guide before making a pull request.
https://github.dev/youzan/vant
Vant is MIT licensed.
FAQs
Mobile UI Components built on Vue
The npm package vant receives a total of 36,763 weekly downloads. As such, vant popularity was classified as popular.
We found that vant demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
An advanced npm supply chain attack is leveraging Ethereum smart contracts for decentralized, persistent malware control, evading traditional defenses.
Security News
Research
Attackers are impersonating Sindre Sorhus on npm with a fake 'chalk-node' package containing a malicious backdoor to compromise developers' projects.
Security News
The npm package for the LottieFiles Player web component was hit with a supply chain attack after a software engineer's npmjs credentials were compromised.