Vant UI 安装

时间:2023-03-09 04:00:37
Vant UI  安装

一:安装

npm i vant -S

二、引入组件(共有三个方法)

  方法一:使用 babel-plugin-import (推荐)

  1、 安装 babel-plugin-import 插件

npm i babel-plugin-import -D

2、 在 .babelrc 或 babel-loader 中添加插件配置  请覆盖原先代码否则会报错

{
"plugins": [
["import", { "libraryName": "vant", "style": true }]
]
}

 3、在代码中引入Vant组件,插件会自动将代码转化为方式二中的按需引入形式。

import { Button } from 'vant';

  方法二:按需引入组件

import { Button } from 'vant/lib/button';
import 'vant/lib/vant-css/base.css';
import 'vant/lib/vant-css/button.css';

  

     方法三:导入所有组件

import Vue from 'vue';
import Vant from 'vant';
import 'vant/lib/vant-css/index.css'; Vue.use(Vant);

vue小白交流群,希望能够帮助到大家!

Vant UI  安装                                  Vant UI  安装