微信小程序vantui安装及使用教程

使用npm安装vantui

1在文件终端打开cmd

2输入npm init进行初始化项目,中途一直回车确认即可

 

 出现is this ok?就代表初始化完成

3输入npm i @vant/weapp -S --production开始下载资源

4修改相关配置

4.1将 app.json 中的 "style": "v2" 去除

4.2 修改 project.config.json添加配置

"packNpmRelationList": [
      {
        "packageJsonPath": "./package.json",
        "miniprogramNpmDistDir": "./miniprogram/"
      }
    ]

5点击工具选择构建npm包

6使用,引入组件在app.json文件中

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

对应wxml

<van-button type="primary">按钮</van-button>