小程序引入vant weapp ui组件

小程序引入vant weapp ui组件

 

引入新版vant weapp组件，首先在项目目录下创建一个miniprogram目录

项目目录/miniprogram/：

1、第一步：npm init 然后一路回车

2、第二步：npm i @vant/weapp -S --production

3、第三步： 在微信开发--工具--执行npm 构建

• 右上角详情--（勾选使用npm模块，es6转es5)

• 构建完会生成一个miniprogram_npm文件夹

4、使用：在需要引入的.json文件里添加配置：

• 全局引用：在app.js中引入，在任何页面都能使用

• 注意必须使用绝对路径 （最前面的斜杠不能掉）

{
  "usingComponents": {
  // 此方法，前面被添加pages/index/，找不到
  // "van-button": "vant-weapp/button/index",
   "van-button": "/miniprogram/miniprogram_npm/@vant/weapp/button/index" 
}

！！！ 按官网引入新版vant，一直路径出错，直接就绝对路径查找了

遇到问题：

1.引入input组件输入时报错：wx.nextTick is not a function;at undefined page onInput function

　　解决报错：将调试基础库改为 “2.10.3”