如何在微信小程序開發中正確的使用vant ui組件

微信小程序終於能夠支持npm導入第三方庫了（https://developers.weixin.qq....），可是這種導入模式和使用模式有別於咱們使用的npm調用。今天我按照有贊新出的vant小程序ui庫來說解如何導入npm資源。

第一步：

在小程序工程的根目錄下執行：

npm i vant-weapp -S --production

第二步：

保證當前你的微信開發者工具是最新版本，而後點擊執行「構建npm「

構建成功後會提示：

同時項目根目錄中會多出一個目錄「miniprogram_npm」，這個就是小程序能夠識別的npm第三方庫。

第三步：

這時候當咱們須要在一個頁面中調用vant組件，那麼就要在對應的頁面json中添加相似以下配置：

{

"usingComponents":{

    "van-button":"/miniprogram_npm/vant-weapp/button/index"

}

}

接着你就能夠在wxml中直接調用這個ui組件了。

注意，對於vant庫來講其實你並不須要在頁面對應的js中require vant-weapp組件。

首發於本人blog:http://www.leeon.me/a/use-van...，轉載請註明！