Vant Weapp：微信小程序的原生组件库详解

Vant Weapp 是有赞出品的 Vant 微信小程序版本，是纯原生小程序组件——直接在 WXML 里用。它覆盖按钮、单元格、表单、弹窗、动作面板、日历、上传、骨架屏等小程序常见场景，中文文档完善。

它解决什么问题

微信小程序原生开发，不想引框架、又想要一套现成且好看的组件。

搜「Vant」容易和 Vue 版 Vant 搞混，两者其实不是同一个项目。

核心能力

它和 Vue 版 Vant 是两回事

Vant Weapp 是「微信小程序」原生版本，运行在微信小程序环境里；Vue 版 Vant 是给 Vue Web 项目用的。两者仓库独立、技术栈不同，不能互相替代。

另一个常见误区：做 uni-app 项目通常不用 Vant Weapp，而是选 uView 这类 uni-app 原生组件库，否则跨端编译会出问题。选型时先确认你的运行环境是「微信小程序」还是「uni-app / Vue」。

同类工具怎么选

谁适合用

• 用微信原生小程序、想要现成组件的个人或团队
• 做小程序商城、表单、日历等常见场景的开发者
• 偏好中文文档、按示例快速上手的人

怎么开始

1. 通过 npm 安装 vant-weapp，或用小程序开发者工具的构建 npm 功能。
2. 在页面的 json 里配置 usingComponents 引入需要的组件。
3. 在 wxml 里像原生标签一样使用（如 <van-button>）。
4. 按文档按需引入，避免整包拖大小程序体积。
5. 样式与主题通过 CSS 变量覆盖，贴合品牌。

常见问题

和 Vue 版 Vant 一样吗？
不一样。Vant Weapp 是小程序原生版，Vue 版 Vant 是 Web 版，两者独立维护。

uni-app 能用吗？
不建议。uni-app 项目通常选 uView 等原生组件库，跨端更稳。

授权和商用？
采用 MIT，可商用、可闭源，保留版权声明即可。

授权与合规

Vant Weapp 采用 MIT 协议，可用于商业小程序与闭源产品；注意它是小程序原生组件，与 Vue 版 Vant 是不同仓库、不同技术栈。 官网：vant-ui.github.io/vant-weapp。