微信小程序中安装使用Vant Weapp

Vant Weapp 是移动端 Vue 组件库 Vant 的小程序版本,两者基于相同的视觉规范,提供一致的 API 接口,助力开发者快速搭建小程序应用。

Vant Weapp官网:https://youzan.github.io/vant-weapp

安装步骤:

1、需要使用 npm 安装Vant Weapp,npm 集成在 Node.js 中的,安装参见文章:安装 Node.js 使用 npm

2、在微信开发者工具中,右键项目中的miniprogram目录,选择在终端中打开,运行npm init 生成package.json文件

npm init

3、通过 npm 安装 Vant Weapp

npm i @vant/weapp -S --production

4、在微信开发者工具中,选择菜单 “工具”-->“构建 npm”,会在miniprogram目录下面生成 miniprogram_npm目录,里面就是Vant Weapp 的组件库

5、点击微信开发者工具最右边的详情按钮,设置中勾选 “使用 npm 模块”

6、使用方法示例
在app.json或index.json中引入组件。

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

在index.wxml 文件输入:

默认按钮

 

你可能感兴趣的:(微信小程序中安装使用Vant Weapp)