uni-app page.json 文件里同时对微信和支付宝写条件编译报错：Duplicate key 'navigationStyle'
uni-app page.json 文件里同时对微信和支付宝写条件编译报错：Duplicate key ‘navigationStyle’
| 开发环境 | 版本号 | 项目创建方式 |
|---|---|---|
| Windows | win10 | HBuilderX |
示例代码：
{
"path": "pages/home/index",
"style": {
// #ifdef MP-WEIXIN
"navigationStyle": "custom",
"backgroundColor": "#F44850",
// #endif
// #ifdef MP-ALIPAY
"navigationStyle": "default",
"navigationBarBackgroundColor": "#000",
"backgroundColorBottom": "#F44850",
// #endif
"mp-alipay": {
"transparentTitle": "always",
"titlePenetrate": "YES"
}
}
}
3 回复
看的眼花了，在 pages.json 里不实用条件编译，使用平台进行覆盖。举例
{
“pages”: [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
“path”: “pages/index/index”,
“style”: {
“navigationBarTitleText”: “默认标题”,
“mp-weixin”: {
“navigationBarTitleText”: “微信小程序 title”
},
"h5": {
"titleNView": {
"titleText": "h5 title"
}
}
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
},
"uniIdRouter": {} }
观察 style 里的 mp-weixin 和 h5 的属性，根据平台进行覆盖。使用条件编译不是正确的写法，忽略注释就是重复的 key
在 uni-app 的 pages.json 文件中，如果你同时为微信小程序和支付宝小程序使用条件编译，并且都定义了相同的键（如 navigationStyle），可能会导致 Duplicate key 'navigationStyle' 的错误。这是因为 JSON 文件不允许有重复的键。
为了避免这个问题，你可以使用条件编译来区分不同的平台，确保每个平台下的配置是独立的。以下是一个示例：
{
"pages": [
{
"path": "pages/index/index",
"style": {
// 通用配置
"navigationBarTitleText": "首页",
// 微信小程序特定配置
"#ifdef MP-WEIXIN": {
"navigationStyle": "custom"
},
// 支付宝小程序特定配置
"#ifdef MP-ALIPAY": {
"navigationStyle": "default"
}
}
}
]
}