下载安装vant组件库

移动端组件库参考: https://www.jianshu.com/p/c3c671787d1d

官网:https://vant-contrib.gitee.io/vant/v2/#/zh-CN/

1, 下载安装vant组件库
     cnpm i vant@latest-v2 --save

2, 以下两种导入方式:
导入所有组件:  在main.js中添加如下代码即可
    import Vant from 'vant';
    import 'vant/lib/index.css';
    Vue.use(Vant);
    然后在组件中直接复制官方文档中的组件代码即可显示
    <van-icon name="chat-o"  badge="9" color="#1989fa" size="40"/>
按需导入组件(推荐)
    首先安装插件 :   cnpm i babel-plugin-import --save
    在根目录的babel.config.js文件中添加plugins字段
    module.exports = {
          presets: [
                '@vue/cli-plugin-babel/preset'
          ],
          plugins: [
                ['import', {
                      libraryName: 'vant',
                      libraryDirectory: 'es',