（填坑篇）Vue3.0全局引入Vant组件

废话不多说，上步骤1. 安装vantnpm i vant2. main.js里面引用相关资源import vant from 'vant';import 'vant/lib/index.css';3. main.js里面的完整代码如下import { createApp } from 'vue'import App from './App.vue'import router from './rou

风生晚凉

7078人浏览 · 2022-03-03 01:32:01

风生晚凉 · 2022-03-03 01:32:01 发布

废话不多说，上步骤

1. 安装vant

npm i vant

2. main.js里面引用相关资源

import vant from 'vant';
import 'vant/lib/index.css';

3. main.js里面的完整代码如下

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'

import vant from 'vant';
import 'vant/lib/index.css';

createApp(App).use(router).use(vant).mount('#app')

4. 然后就可以直接在vue文件里面使用啦，比如像这个一样：

<template>
  <div class="hello">
    <p>
      For a guide and recipes on how to configure / customize this project,<br>
      check out the
      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
    </p>
    <h3>Installed CLI Plugins</h3>
    <van-button type="primary">主要按钮</van-button>
    <van-button type="success">成功按钮</van-button>
    <van-button type="default">默认按钮</van-button>
    <van-button type="warning">警告按钮</van-button>
    <van-button type="danger">危险按钮</van-button>

  </div>
</template>