当前位置:   article > 正文

小程序--引入vant组件库

小程序--引入vant组件库

一、npm初始化

        在微信开发者工具中打开终端,输入npm init,对npm进行初始化 

二、安装vant组件库

npm install @vant/weapp

 

三、修改app.json

        修改 app.json,移除全局配置 "style": "v2",否则 Vant 组件的样式会受到影响。

四、修改project.config.json

        修改project.config.json中的setting配置选项的 packNpmManually 和 packNpmRelationList

 

五、构建 npm

        小程序中凡是通过 npm 下载的模块,都必须经过构建才能使用,构建后的内容会存放在 miniprogram_npm 中 。

 

 六、使用vant

  1. {
  2. "usingComponents": {
  3. "van-button": "@vant/weapp/button/index"
  4. },
  5. "navigationStyle": "custom"
  6. }
  1. <van-button type="default">默认按钮</van-button>
  2. <van-button type="primary">主要按钮</van-button>
  3. <van-button type="info">信息按钮</van-button>
  4. <van-button type="warning">警告按钮</van-button>
  5. <van-button type="danger">危险按钮</van-button>

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/繁依Fanyi0/article/detail/140957
推荐阅读
相关标签
  

闽ICP备14008679号