加一個(gè)vue.use(Button)

官方文檔有點(diǎn)坑，可以看官方的DEMO，還需要注冊(cè)組件

components:{
    [Button.name]: Button,
    ...
},

沒那么復(fù)雜，在入口文件main.js里面加上

import Vant from 'vant';
import 'vant/lib/vant-css/index.css';
Vue.use(Vant);

頁面上直接使用組件就行了。

第一張圖，加上一句

export default{
    components:{
        Button,
    },
    // ...
}

見官方文檔https://youzan.github.io/vant... “快速上手--方式三”，另外github的基于step的說明的確很坑爹，已提交commit了
方式三. 導(dǎo)入所有組件
配置 babel-plugin-import 插件后將不允許導(dǎo)入所有組件的方式

import Vue from 'vue';
import Vant from 'vant';
import 'vant/lib/vant-css/index.css';

Vue.use(Vant);

問題解決了，因?yàn)轫撁嫔衔抑皇褂玫腷utton組件，所以使用那個(gè)引用那個(gè)就可以了，在main.js中加上

import { Button } from 'vant';

Vue.use(Button);

之前有朋友提到過直接

import Vant from 'vant';
import 'vant/lib/vant-css/index.css';
Vue.use(Vant);

我測試過也是不行的，因?yàn)関ant會(huì)報(bào)一個(gè) Vant is not defined 的錯(cuò)誤。如果想要引用其他的組件，直接在花括號(hào)里加上就可以了。前提是安裝使用 babel-plugin-import