Vue-组件 vant 轻量、可靠的移动端 Vue 组件库

安装

基于 Vue Cli 3 安装 vant

# 通过 npm 安装

npm i vant -S

# 通过 yarn 安装

yarn add vant

引入组件

引入所有组件（不推荐）

Vant 支持一次性导入所有组件，引入所有组件会增加代码包体积，因此不推荐这种做法

在 main.ts 文件中

import Vant from 'vant';

import 'vant/lib/index.css';

Vue.use(Vant);

按需引入（推荐）

在 main.ts 中引入 Css 文件

import 'vant/lib/index.css';

在想要使用组件的页面引入组件

import { Button } from "vant";

components 注册组件

[Button.name]: Button

HTML中使用组件即可

<van-button type="info">信息按钮</van-button>