vue項目 -- 引入vant組件

 1、創建一個Vue項目 :  vue create vue-app  或者 vue init webpack my-vue(項目文件夾的名字)

 2、通過 npm 安裝vant:    npm i vant -S

 3、 自動按需引入vant組件 (推薦) 

　　babel-plugin-import 是一款 babel 插件，它會在編譯過程中將 import 的寫法自動轉換為按需引入的方式.

 # 3.1安裝插件 :   npm i babel-plugin-import -D  

注意：

1、如果是webpack創建的項目，在.babelrc 中添加配置：

{
  "plugins": [ ["import", { "libraryName": "vant", "libraryDirectory": "es", "style": true }] ] }

2、如果是通過vue create 方式創建的項目，

在babel.config.js 中添加配置： 加入紅線框內的內容即可

  

 # 3.2 在main.js中局部引入所需要的組件

import { Button, Tabbar, TabbarItem, NavBar, Card } from 'vant';

Vue.use(Button) .use(Tabbar) .use(TabbarItem) .use(NavBar) .use(Card);