微信小程序 第三方组件的运用 vant-weapp

论坛 期权论坛 编程之家     
选择匿名的用户   2021-6-2 16:45   1766   0

小程序中使用别人开发的组件,需要借助node npm 等工具,从而让组件开发具备工程化和模块化。 以有赞的 vant-weapp 为例一下是具体步骤

vant-weapp 官方文档

1、桌面创建小程序项目 demo 在开发工具中打开

2、打开项目目录 在地址栏中输入 cmd 打开我们的命令行终端 (项目名称必须符合命名规则)

3、项目初始化 npm init -y 回车 在项目目录下会出现一个 package.json 的文件

4、下载 vant-weapp 框架 https://github.com/youzan/vant-weapp

  • npm i vant-weapp -S --production 这个是安装 0.x版本
  • npm i @vant/weapp -S --production 安装最新版本

5、构建小程序 npm

  • 打开小程序开发工具,找到工具选项,点击构建npm (等待)
  • 击开发工具中的详情-->本地设置----->勾选使用npm

6、项目根目录下会出现一个 miniprogram_npm 的文件夹

7、使用第三方组件

  • 打开miniprogram_npm文件夹----@vant-----weapp 文件夹下的所有组件都可使用

  • 在page-----index.json中注册 注意:两种路径都可以成功引入 "VantCheckbox" : "@vant/weapp/checkbox" 和 "VantCheckbox" : "../../miniprogram_npm/@vant/weapp/checkbox"

  • 在 index.wxml中使用

多使用几个

分享到 :
0 人收藏
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

积分:3875789
帖子:775174
精华:0
期权论坛 期权论坛
发布
内容

下载期权论坛手机APP