新版小程序引入vant-Weapp保姆级教程
跟着vant weapp官方文档的快速入手,踩了一堆坑,于是正确的引入姿势就来了
1.在小程序根目录下打开终端执行命令:
npm init
2.安装你要安装的第三方包::
npm i vant-weapp -S --production
3.设置栏:
工具 -> 构建npm
4.修改 project.config.json
{
"setting":{
"packNpmManually": true,
"packNpmRelationList": [
{
"packageJsonPath": "./package.json",
"miniprogramNpmDistDir": "./"
}
],
}
}
5.将 app.json 中的 “style”: “v2” 去除
小程序的新版基础组件强行加上了许多样式,难以覆盖,不关闭将造成部分组件样式混乱。
6.引入组件在index.json或app.json中:
"usingComponents": {
//写法一
"van-button": "/miniprogram_npm/vant-weapp/button/index"
//写法二
"van-button": "@vant/weapp/button/index"
}