UniApp develops H5 and introduces Vant

Step 1: Download and install vant

npm i vant -S --production

Step 2: Main.ts introduces Vant

import {createSSRApp} from 'vue'

import App from './App.vue'
// 引入Vant
import Vant from "vant";

export function createApp() {
    const app = createSSRApp(App).use(Vant)
    return {
        app,
    }
}

Whether it is js or ts, Vue.use() is right

It can also be imported on demand after the structure

import {Button,......} from "vant"

Vue.use(Button)

Step 3: Introduce the global style into App.vue, try both imports, there are many pitfalls in it

<style>
/*每个页面都引入Vant*/
/*@import url("./node_modules/vant/lib/index.css");*/
@import "vant/lib/index.css";
</style>

Step 4: It's ready to use

Vant 3 - Lightweight Mobile UI Components built on VueLightweight Mobile UI Components built on Vuehttps://vant-contrib.gitee.io/vant/#/zh-CN

Guess you like

Origin blog.csdn.net/weixin_42078172/article/details/127402299