Vant Weapp 是移動(dòng)端 Vue 組件庫(kù) Vant 的小程序版本，兩者基于相同的視覺(jué)規(guī)范，提供一致的 API 接口，幫忙開(kāi)發(fā)者快速搭建小程序應(yīng)用。

1 安裝

首先 cmd 命令行進(jìn)入項(xiàng)目，先后執(zhí)行以下命令，初始化 npm 配置：

npm init
npm install

然后執(zhí)行 npm 安裝 Vant Weapp：

npm i @vant/weapp -S --production

• i 是 install 的簡(jiǎn)寫形式。
• -S 是 --save 的簡(jiǎn)寫形式，即寫入 dependencies。
• --production 表示下載模塊到 node_modules 目錄中。

安裝成功后，在微信開(kāi)發(fā)者工具中新建的目錄如下：

2 配置

接著，在微信開(kāi)發(fā)者工具中，選擇 “工具” -》“構(gòu)建 npm”：

3 使用

在頁(yè)面 json 中配置組件路徑，比如這里配置了按鈕組件：

{
  "usingComponents": {
    "van-button": "@vant/weapp/button"
  }
}

然后在頁(yè)面 wxml 中配置相應(yīng)的按鈕標(biāo)簽：

 <van-button type="primary">按鈕</van-button>

效果：