vue2项目配置vant（移动端）

目录

1.通过npm安装

2.按需引入组件

3. 安装插件

4.在babel.config里面进行配置

注意：报错解决方法

---

1.通过npm安装

# Vue 3 项目，安装最新版 Vant：
npm i vant -S

# Vue 2 项目，安装 Vant 2：
npm i vant@latest-v2 -S

2.按需引入组件

import Vue from 'vue';
import { Button } from 'vant';

Vue.use(Button);

3. 安装插件

npm i babel-plugin-import -D

4.在babel.config里面进行配置

module.exports = {
  plugins: [
    ['import', {
      libraryName: 'vant',
      libraryDirectory: 'es',
      style: (name) => `${name}/style/less`,
    }, 'vant']
  ]
}

注意：报错解决方法

则需卸载并重新安装 less-loader

 则需安装版本匹配的less与less-loader（安装时会有提示，注意警告）