Skip to content

Latest commit

 

History

History
142 lines (99 loc) · 3.82 KB

README.md

File metadata and controls

142 lines (99 loc) · 3.82 KB
Raw

logo

Lightweight Mobile UI Components built on Vue

npm version Build Status downloads JS Gzip Size CSS Gzip Size issue Coverage Status

🇨🇳 访问中文版   🚀 Vant Weapp - 小程序版

Features

  • 50+ Reusable components
  • 80%+ Unit test coverage
  • Extensive documentation and demos
  • Support babel-plugin-import
  • Support TypeScript
  • Support SSR

Install

NPM

npm i vant -S

YARN

yarn add vant

CDN

<!-- import style -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@1.6/lib/index.css" />

<!-- import script -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vant@1.6/lib/vant.min.js"></script>

Quickstart

1. Use babel-plugin-import (Recommended)

# Install babel-plugin-import
npm i babel-plugin-import -D
// set babel config in .babelrc or babel-loader
// Note: Don't set libraryDirectory if you are using webpack 1.
{
  "plugins": [
    ["import", {
      "libraryName": "vant",
      "libraryDirectory": "es",
      "style": true
    }]
  ]
}

Then you can import components from vant, equivalent to import manually below.

import { Button } from 'vant';

If you are using TypeScript，please use ts-import-plugin instead

2. Manually import

import Button from 'vant/lib/button';
import 'vant/lib/button/style';

3. Import all components

import Vue from 'vue';
import Vant from 'vant';
import 'vant/lib/index.css';

Vue.use(Vant);

If you configured babel-plugin-import, you won't be allowed to import all components.

See more in Quickstart.

Contribution

Please make sure to read the Contributing Guide before making a pull request.

Browser Support

Modern browsers and Android 4.0+, iOS 6+.

Links

Preview

You can scan the following QR code to access the demo：

Wechat Group

Scan the qrcode to join our wechat discussion group, please note that you want to join Vant discussion group.

LICENSE

MIT