微信小程序引入第三方组件库Vant Weapp

本篇讲述微信小程序引入第三方组件库Vant Weapp

  1. 在引入第三方组件库之前鼠标右键点击miniprogram文件夹,打开终端
    微信小程序引入第三方组件库Vant Weapp_第1张图片
  2. 打开终端之后执行npm init 命令,执行这个命令是目的是在miniprogram文件夹中初始化package.json文件,执行完毕之后就会在miniprogram生成一个初始的package.json文件。
    微信小程序引入第三方组件库Vant Weapp_第2张图片
  3. 根据 Vant Weapp文档在终端执行npm i vant-weapp -S --production
  4. 构建npm包。打开微信开发者工具,点击工具,选择构建npm,会看见新增了vant-weapp的npm包文件。
    微信小程序引入第三方组件库Vant Weapp_第3张图片
  5. 打开右上角的详情,打开本地设置,选择使用npm模块
    微信小程序引入第三方组件库Vant Weapp_第4张图片
  6. 参照vant-weapp的官方文档进行组件引用
    微信小程序引入第三方组件库Vant Weapp_第5张图片
    需要在json文件中自己改变一下组件引用的路径
    微信小程序引入第三方组件库Vant Weapp_第6张图片
    然后在wxml中使用即可
    微信小程序引入第三方组件库Vant Weapp_第7张图片
    引用效果如下:
    微信小程序引入第三方组件库Vant Weapp_第8张图片
    其他的不再一一示例,根据官方文档引用即可。

你可能感兴趣的:(前端爬坑之路,微信小程序)