Package Exports
- vant
- vant/es/action-sheet
- vant/es/action-sheet/style
- vant/es/action-sheet/style/less
- vant/es/area
- vant/es/area/style
- vant/es/area/style/less
- vant/es/badge
- vant/es/badge/style
- vant/es/button
- vant/es/button/style
- vant/es/button/style/less
- vant/es/calendar
- vant/es/calendar/style
- vant/es/calendar/style/less
- vant/es/card
- vant/es/card/style
- vant/es/card/style/less
- vant/es/cascader
- vant/es/cascader/style/less
- vant/es/cell
- vant/es/cell-group
- vant/es/cell-group/style
- vant/es/cell-group/style/less
- vant/es/cell/style
- vant/es/cell/style/less
- vant/es/checkbox
- vant/es/checkbox-group
- vant/es/checkbox-group/style
- vant/es/checkbox-group/style/less
- vant/es/checkbox/style
- vant/es/checkbox/style/less
- vant/es/circle
- vant/es/circle/style
- vant/es/circle/style/less
- vant/es/col
- vant/es/col/style
- vant/es/col/style/less
- vant/es/collapse
- vant/es/collapse-item
- vant/es/collapse-item/style
- vant/es/collapse-item/style/less
- vant/es/collapse/style
- vant/es/collapse/style/less
- vant/es/contact-card
- vant/es/contact-card/style
- vant/es/contact-edit
- vant/es/contact-edit/style
- vant/es/count-down
- vant/es/count-down/style
- vant/es/count-down/style/less
- vant/es/coupon-cell
- vant/es/coupon-cell/style
- vant/es/coupon-list
- vant/es/coupon-list/style
- vant/es/datetime-picker
- vant/es/datetime-picker/style
- vant/es/datetime-picker/style/less
- vant/es/dialog
- vant/es/dialog/style
- vant/es/dialog/style/less
- vant/es/divider
- vant/es/divider/style
- vant/es/divider/style/less
- vant/es/dropdown-item
- vant/es/dropdown-item/style
- vant/es/dropdown-item/style/less
- vant/es/dropdown-menu
- vant/es/dropdown-menu/style
- vant/es/dropdown-menu/style/less
- vant/es/empty
- vant/es/empty/style
- vant/es/empty/style/less
- vant/es/field
- vant/es/field/style
- vant/es/field/style/less
- vant/es/form
- vant/es/form/style
- vant/es/form/style/less
- vant/es/grid
- vant/es/grid-item
- vant/es/grid-item/style
- vant/es/grid-item/style/less
- vant/es/grid/style
- vant/es/grid/style/less
- vant/es/icon
- vant/es/icon/style
- vant/es/icon/style/less
- vant/es/image
- vant/es/image-preview
- vant/es/image-preview/style
- vant/es/image-preview/style/less
- vant/es/image/style
- vant/es/image/style/less
- vant/es/index-anchor
- vant/es/index-anchor/style
- vant/es/index-anchor/style/less
- vant/es/index-bar
- vant/es/index-bar/style
- vant/es/index-bar/style/less
- vant/es/index.js
- vant/es/lazyload
- vant/es/lazyload/style
- vant/es/lazyload/style/less
- vant/es/list
- vant/es/list/style
- vant/es/list/style/less
- vant/es/loading
- vant/es/loading/style
- vant/es/loading/style/less
- vant/es/nav-bar
- vant/es/nav-bar/style
- vant/es/nav-bar/style/less
- vant/es/notice-bar
- vant/es/notice-bar/style
- vant/es/notice-bar/style/less
- vant/es/notify
- vant/es/notify/style
- vant/es/notify/style/less
- vant/es/number-keyboard
- vant/es/number-keyboard/style
- vant/es/number-keyboard/style/less
- vant/es/overlay
- vant/es/overlay/style
- vant/es/overlay/style/less
- vant/es/pagination
- vant/es/pagination/style
- vant/es/pagination/style/less
- vant/es/password-input
- vant/es/password-input/style
- vant/es/password-input/style/less
- vant/es/picker
- vant/es/picker/style
- vant/es/picker/style/less
- vant/es/popover
- vant/es/popover/style
- vant/es/popup
- vant/es/popup/style
- vant/es/popup/style/less
- vant/es/progress
- vant/es/progress/style
- vant/es/progress/style/less
- vant/es/pull-refresh
- vant/es/pull-refresh/style
- vant/es/pull-refresh/style/less
- vant/es/radio
- vant/es/radio-group
- vant/es/radio-group/style
- vant/es/radio-group/style/less
- vant/es/radio/style
- vant/es/radio/style/less
- vant/es/rate
- vant/es/rate/style
- vant/es/rate/style/less
- vant/es/row
- vant/es/row/style
- vant/es/row/style/less
- vant/es/search
- vant/es/search/style
- vant/es/search/style/less
- vant/es/share-sheet
- vant/es/share-sheet/style
- vant/es/share-sheet/style/less
- vant/es/sidebar
- vant/es/sidebar-item
- vant/es/sidebar-item/style
- vant/es/sidebar-item/style/less
- vant/es/sidebar/style
- vant/es/sidebar/style/less
- vant/es/skeleton
- vant/es/skeleton/style
- vant/es/skeleton/style/less
- vant/es/slider
- vant/es/slider/style
- vant/es/slider/style/less
- vant/es/step
- vant/es/step/style
- vant/es/step/style/less
- vant/es/stepper
- vant/es/stepper/style
- vant/es/stepper/style/less
- vant/es/steps
- vant/es/steps/style
- vant/es/steps/style/less
- vant/es/sticky
- vant/es/sticky/style
- vant/es/sticky/style/less
- vant/es/swipe
- vant/es/swipe-cell
- vant/es/swipe-cell/style
- vant/es/swipe-cell/style/less
- vant/es/swipe-item
- vant/es/swipe-item/style
- vant/es/swipe-item/style/less
- vant/es/swipe/style
- vant/es/swipe/style/less
- vant/es/switch
- vant/es/switch/style
- vant/es/switch/style/less
- vant/es/tab
- vant/es/tab/style
- vant/es/tab/style/less
- vant/es/tabbar
- vant/es/tabbar-item
- vant/es/tabbar-item/style
- vant/es/tabbar-item/style/less
- vant/es/tabbar/style
- vant/es/tabbar/style/less
- vant/es/tabs
- vant/es/tabs/style
- vant/es/tabs/style/less
- vant/es/tag
- vant/es/tag/style
- vant/es/tag/style/less
- vant/es/toast
- vant/es/toast/style
- vant/es/toast/style/index.js
- vant/es/toast/style/less
- vant/es/tree-select
- vant/es/tree-select/style
- vant/es/tree-select/style/less
- vant/es/uploader
- vant/es/uploader/style
- vant/es/uploader/style/less
- vant/lib/action-sheet
- vant/lib/action-sheet/style
- vant/lib/address-edit
- vant/lib/address-list
- vant/lib/area
- vant/lib/area/style
- vant/lib/badge
- vant/lib/badge/style
- vant/lib/button
- vant/lib/button/style
- vant/lib/button/style/less
- vant/lib/calendar
- vant/lib/calendar/style
- vant/lib/card
- vant/lib/card/style
- vant/lib/cell
- vant/lib/cell-group
- vant/lib/cell-group/style
- vant/lib/cell-group/style/less
- vant/lib/cell/style
- vant/lib/cell/style/less
- vant/lib/checkbox
- vant/lib/checkbox-group
- vant/lib/checkbox-group/style
- vant/lib/checkbox-group/style/less
- vant/lib/checkbox/style
- vant/lib/checkbox/style/less
- vant/lib/circle
- vant/lib/circle/style
- vant/lib/col
- vant/lib/col/style
- vant/lib/col/style/less
- vant/lib/collapse
- vant/lib/collapse-item
- vant/lib/collapse-item/style
- vant/lib/collapse/style
- vant/lib/contact-card
- vant/lib/contact-edit
- vant/lib/contact-list
- vant/lib/count-down
- vant/lib/count-down/style
- vant/lib/count-down/utils
- vant/lib/coupon
- vant/lib/coupon-cell
- vant/lib/coupon-cell/style
- vant/lib/coupon-list
- vant/lib/coupon-list/style
- vant/lib/datetime-picker
- vant/lib/datetime-picker/style
- vant/lib/datetime-picker/style/index.js
- vant/lib/datetime-picker/style/less
- vant/lib/dialog
- vant/lib/dialog/style
- vant/lib/dialog/style/less
- vant/lib/divider
- vant/lib/divider/style
- vant/lib/divider/style/less
- vant/lib/dropdown-item
- vant/lib/dropdown-item/style
- vant/lib/dropdown-item/style/index.js
- vant/lib/dropdown-menu
- vant/lib/dropdown-menu/style
- vant/lib/dropdown-menu/style/index.js
- vant/lib/empty
- vant/lib/empty/style
- vant/lib/field
- vant/lib/field/style
- vant/lib/field/style/index.js
- vant/lib/field/style/less
- vant/lib/form
- vant/lib/form/style
- vant/lib/form/style/less
- vant/lib/grid
- vant/lib/grid-item
- vant/lib/grid-item/style
- vant/lib/grid/style
- vant/lib/icon
- vant/lib/icon/local.css
- vant/lib/icon/style
- vant/lib/icon/style/less
- vant/lib/image
- vant/lib/image-preview
- vant/lib/image-preview/style
- vant/lib/image-preview/style/index
- vant/lib/image/style
- vant/lib/index-anchor
- vant/lib/index-anchor/style
- vant/lib/index-bar
- vant/lib/index-bar/style
- vant/lib/index.css
- vant/lib/index.less
- vant/lib/lazyload
- vant/lib/lazyload/style
- vant/lib/list
- vant/lib/list/style
- vant/lib/list/style/less
- vant/lib/loading
- vant/lib/loading/style
- vant/lib/loading/style/less
- vant/lib/locale
- vant/lib/locale/lang/en-US
- vant/lib/locale/lang/zh-CN
- vant/lib/locale/lang/zh-HK
- vant/lib/locale/lang/zh-TW
- vant/lib/nav-bar
- vant/lib/nav-bar/style
- vant/lib/notice-bar
- vant/lib/notice-bar/style
- vant/lib/notify
- vant/lib/notify/style
- vant/lib/notify/style/less
- vant/lib/number-keyboard
- vant/lib/number-keyboard/style
- vant/lib/overlay
- vant/lib/overlay/style
- vant/lib/pagination
- vant/lib/pagination/style
- vant/lib/password-input
- vant/lib/password-input/style
- vant/lib/picker
- vant/lib/picker/index.css
- vant/lib/picker/style
- vant/lib/picker/style/less
- vant/lib/popup
- vant/lib/popup/style
- vant/lib/popup/style/index.js
- vant/lib/popup/style/less
- vant/lib/progress
- vant/lib/progress/style
- vant/lib/pull-refresh
- vant/lib/pull-refresh/style
- vant/lib/pull-refresh/style/less
- vant/lib/radio
- vant/lib/radio-group
- vant/lib/radio-group/style
- vant/lib/radio-group/style/less
- vant/lib/radio/style
- vant/lib/radio/style/less
- vant/lib/rate
- vant/lib/rate/style
- vant/lib/row
- vant/lib/row/style
- vant/lib/row/style/less
- vant/lib/search
- vant/lib/search/style
- vant/lib/search/style/less
- vant/lib/share-sheet
- vant/lib/share-sheet/style
- vant/lib/sidebar
- vant/lib/sidebar-item
- vant/lib/sidebar-item/style
- vant/lib/sidebar/style
- vant/lib/skeleton
- vant/lib/skeleton/style
- vant/lib/slider
- vant/lib/slider/style
- vant/lib/step
- vant/lib/step/style
- vant/lib/step/style/less
- vant/lib/stepper
- vant/lib/stepper/style
- vant/lib/steps
- vant/lib/steps/style
- vant/lib/steps/style/less
- vant/lib/sticky
- vant/lib/sticky/style
- vant/lib/submit-bar
- vant/lib/swipe
- vant/lib/swipe-cell
- vant/lib/swipe-cell/style
- vant/lib/swipe-cell/style/less
- vant/lib/swipe-item
- vant/lib/swipe-item/style
- vant/lib/swipe-item/style/less
- vant/lib/swipe/style
- vant/lib/swipe/style/less
- vant/lib/switch
- vant/lib/switch/style
- vant/lib/switch/style/less
- vant/lib/tab
- vant/lib/tab/style
- vant/lib/tab/style/less
- vant/lib/tabbar
- vant/lib/tabbar-item
- vant/lib/tabbar-item/style
- vant/lib/tabbar/style
- vant/lib/tabs
- vant/lib/tabs/style
- vant/lib/tabs/style/less
- vant/lib/tag
- vant/lib/tag/style
- vant/lib/toast
- vant/lib/toast/index.css
- vant/lib/toast/style
- vant/lib/toast/style/index.js
- vant/lib/toast/style/less
- vant/lib/tree-select
- vant/lib/tree-select/style
- vant/lib/uploader
- vant/lib/uploader/style
- vant/lib/utils
- vant/lib/utils/constant
- vant/lib/utils/create/bem
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vant) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Vant
Mobile UI Components built on Vue
🔥 文档网站(国内) 🌈 文档网站(GitHub) 🇨🇳 中文版介绍
Features
- 65+ Reusable components
- 1kb Component average size (min+gzip)
- 90%+ Unit test coverage
- Extensive documentation and demos
- Support Vue 2 & Vue 3
- Support Tree Shaking
- Support Custom Theme
- Support i18n
- Support TS
- Support SSR
Install
# Install Vant 2 for Vue 2 project
npm i vant -S
# Install Vant 3 for Vue 3 project
npm i vant@next -SQuickstart
import { createApp } from 'vue';
import { Button } from 'vant';
import 'vant/lib/index.css';
const app = createApp();
app.use(Button);See more in Quickstart.
Contribution
Please make sure to read the Contributing Guide before making a pull request.
Browser Support
Vant 2 supports modern browsers and Android >= 4.0、iOS >= 8.0.
Vant 3 supports modern browsers and Chrome >= 51、iOS >= 10.0 (same as Vue 3).
Official Ecosystem
| Project | Description |
|---|---|
| vant-weapp | WeChat MiniProgram UI |
| vant-use | Collection of Vant Composition APIs |
| vant-demo | Collection of Vant demos |
| vant-cli | Scaffold for UI library |
| vant-icons | Vant icons |
| vant-touch-emulator | Using vant in desktop browsers |
Community Ecosystem
| Project | Description |
|---|---|
| vant-react | Vant React |
| vant-aliapp | Alipay MiniProgram UI |
| taroify | Vant Taro |
Links
Preview
You can scan the following QR code to access the demo: