在Vue项目中引用vant

1 图形界面安装

---

详情点击

1. 使用命令vue ui,打开图形界面
2. 观察图形界面中的项目是否是当前的项目，如果不是点击导入，导入自己的项目
   1. 点击左上角项目名称，点击项目管理器

2. 点击导入，并输入项目所在地址

3. 点击依赖,点击安装依赖

5. 输入库的名称，选择开发依赖还是运行以来，点击库进行安装

2 命令行进行安装

---

npm i vant -S
# 或者
yarn add vant

3 按需导入

---

1. 安装插件

npm i babel-plugin-import -D

• babel-plugin-import 在编译过程中将 import 的写法自动转换为按需引入的方式,详情点击

2. 打开babel.config.js,输入以下代码

module.exports = {
  plugins: [
    ['import', {
      libraryName: 'vant',
      libraryDirectory: 'es',
      style: true
    }, 'vant']
  ]
};

3. 使用

import { Button } from 'vant';