vant简介及安装使用

361 阅读1分钟

Vant 是有赞前端团队开源的移动端组件库,于 2017 年开源,已持续维护 4 年时间。Vant 对内承载了有赞所有核心业务,对外服务十多万开发者,是业界主流的移动端组件库之一。

github地址:GitHub - youzan/vant-weapp: 轻量、可靠的小程序 UI 组件库

教程:Vant Weapp - 轻量、可靠的小程序 UI 组件库

1、下载vant组件库

2、下载之后,通过 npm 安装 npm i @vant/weapp -S --production

3、报错:缺少import icons from '../../dist/@vant/icons/src/config';

Error: module “dist/@vant/icons/src/config“ is not defined

image.png

执行以下命令

npm i @vant/icons -S --production

4、 将生成的@vant 文件夹拷贝到vant-weapp-dev下的dist文件夹中

5、将dist文件夹  再拷贝到example文件夹中。

image.png

拷贝后的目录结构:

image.png

6、打开微信开发者工具,把vant-weapp-dev/example目录导入进去。

image.png

7、启动后的页面

image.png