uniapp使用Vant-weapp

Uniapp 是一个基于 Vue.js 的跨平台开发框架，可以用它来快速构建小程序、H5、App 等多个平台的应用。而 Vant-weapp 是一款基于微信小程序的 UI 组件库，提供了丰富的组件和样式，可以大大提升开发效率。

在 Uniapp 中使用 Vant-weapp，需要先将 Vant-weapp 中的组件转化为 Uniapp 中的组件。具体步骤如下：

1. 安装 Vant-weapp

可以通过 npm 或者下载源代码的方式安装 Vant-weapp。这里以 npm 安装为例：

npm i vant-weapp -S --production

2. 将 Vant-weapp 转化为 Uniapp 组件

Uniapp 的组件和微信小程序的组件略有不同，需要将 Vant-weapp 中的组件转化为 Uniapp 中的组件。可以使用 `mpvue-entry` 工具来实现：

npm i mpvue-entry -D

然后在 `build` 目录下创建一个 `mpvue.config.js` 文件，将以下代码复制进去：

const MpvueEntry = require('mpvue-entry')

module.exports = {
  pages: MpvueEntry.getEntry('src/pages/**/*.vue')
}

这样就可以将 Vant-weapp 中的组件转化为 Uniapp 中的组件了。

3. 在页面中使用 Vant-weapp 组件

在页面中引入 Vant-weapp 组件时，需要在 `script` 标签中使用 `import` 引入：

<template>
  <!-- 这里使用 Vant-weapp 的搜索框组件 -->
  <van-search />
</template>

<script>
import { VanSearch } from 'vant-weapp'

export default {
  components: {
    VanSearch
  }
}
</script>

这样就可以在 Uniapp 中使用 Vant-weapp 组件了。需要注意的是，在使用 Vant-weapp 组件时，需要将组件名从 `van-` 前缀改为 `Van`，例如 `van-search` 改为 `VanSearch`。