以前做过一个小程序,也是用的vant-ui,是没问题的。这次我使用了微信小程序云开发,引入组件以后,都没有样式。
代码结构如下
我是在 /minigrogram 目录下执行的 npm init 和 npm i @vant/weapp -S --production。
project.config.json 相关配置:
{
"miniprogramRoot": "miniprogram/",
"cloudfunctionRoot": "cloudfunctions/",
"setting": {
...
"packNpmManually": true,
"packNpmRelationList": [
{
"packageJsonPath": "./miniprogram/package.json",
"miniprogramNpmDistDir": "./miniprogram"
}
],
...
}
"srcMiniprogramRoot": "miniprogram/",
"compileType": "miniprogram",
...
}
引入组件的代码:
index.json
{
"usingComponents": {
"van-tab": "@vant/weapp/tab/index",
"van-tabs": "@vant/weapp/tabs/index"
}
}
index.wxml
<van-tabs active="{{ active }}" bind:change="onChange">
<van-tab title="标签 1">内容 1</van-tab>
<van-tab title="标签 2">内容 2</van-tab>
<van-tab title="标签 3">内容 3</van-tab>
<van-tab title="标签 4">内容 4</van-tab>
</van-tabs>
预览是这样的:
没有任何样式生效:
不知道是不是哪里的配置有问题。
微信开发者工具版本:1.06.2209190
重启客户端即可
在小程序里使用vant标签,v-model的效果怎么样,好用吗
坑爹, 我的也是,没图标显示
太感谢了 重新构建npm样式就生效了!
我也是
miniprogram/app.json: ["usingComponents"]["van-button"] 未找到
需要先删掉以前构建的包 再重新构建样式就出来了
这个问题真的是。。。。。。。
微信开发者工具 》 工具 》 构建npm 就有样式了
请问你解决了嘛?我也遇到这个问题了