uni-app pages json设置了 condition 之后，并且同时存在 index.vue 和 index.unve，app任意机型启动白屏

uni-app pages json设置了 condition 之后，并且同时存在 index.vue 和 index.unve，app任意机型启动白屏

项目信息 详情
产品分类 uniapp/App
PC开发环境 Mac
PC开发环境版本 14.4 (23E214)
HBuilderX类型 正式
HBuilderX版本 4.15
手机系统 全部
手机厂商 华为
页面类型 nvue
Vue版本 vue3
打包方式 云端
项目创建方式 HBuilderX

测试过的手机：所有类型

操作步骤：

【原因】
pages.json 不能配置 condition 就能正常显示UI

"condition": {
  //模式配置，仅开发期间生效
  "current": 0, //当前激活的模式(list 的索引项)
  "list": [
    {
      "name": "首页", //模式名称
      "path": "/pages/index/index" //启动页面，必选
    }
  ]
}

定位了好久，这个代码会导致app白屏

预期结果：

app 正常显示 nvue的页面

实际结果：

app白屏

bug描述：

【问题】
通过 新建项目-》 默认模板
同时存在两个文件 index.nvue 和 index.vue
通过 app运行 无论什么机型安卓+iOS 都显示白屏 只有vue文件的时候会有UI，小程序能显示正常的vue 文件的内容

【bug定位】
pages.json 添加了 “condition”: {
//模式配置，仅开发期间生效
“current”: 0, //当前激活的模式(list 的索引项)
“list”: [
{
“name”: “首页”, //模式名称
“path”: “/pages/index/index” //启动页面，必选
}
]
}

定位了好久，这个代码会导致app白屏，删除这个配置则能正常显示UI


更多关于uni-app pages json设置了 condition 之后，并且同时存在 index.vue 和 index.unve，app任意机型启动白屏的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

小米11 pro测试未复现此问题 【咨询问题/bug处理优先级规则】：https://ask.dcloud.net.cn/article/38139

更多关于uni-app pages json设置了 condition 之后，并且同时存在 index.vue 和 index.unve，app任意机型启动白屏的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在 uni-app 中，pages.json 中的 condition 配置用于根据特定条件加载不同的页面。如果你同时存在 index.vue 和 index.unve 文件，并且在 pages.json 中设置了 condition，可能会导致启动时白屏的问题。以下是一些可能的原因及解决方案：

1. 检查 pages.json 配置

确保 pages.json 中的 condition 配置正确，并且路径和文件名没有拼写错误。例如：

{
  "pages": [
    {
      "path": "pages/index/index",
      "style": {
        "navigationBarTitleText": "首页"
      }
    }
  ],
  "condition": {
    "current": 0,
    "list": [
      {
        "name": "index",
        "path": "pages/index/index"
      }
    ]
  }
}

2. 检查文件命名和路径

确保 index.vue 和 index.unve 文件位于正确的路径下，并且文件名正确。uni-app 会根据 pages.json 中的配置加载对应的文件。

3. 检查文件内容

确保 index.vue 和 index.unve 文件内容正确，没有语法错误或其他问题。可以尝试单独运行 index.vue 或 index.unve，看看是否能够正常加载。

4. 检查 condition 逻辑

确保 condition 逻辑正确，能够正确匹配到对应的条件。如果 condition 逻辑不正确，可能导致无法加载正确的页面，从而出现白屏。

5. 检查编译环境

确保编译环境正确，没有配置错误。可以尝试清除缓存并重新编译项目。

6. 调试日志

在 main.js 或 App.vue 中添加调试日志，查看启动时是否加载了正确的页面。例如：

// main.js
console.log('App launched');

<!-- App.vue -->
<template>
  <div>
    <router-view />
  </div>
</template>

<script>
export default {
  mounted() {
    console.log('App mounted');
  }
}
</script>

7. 使用 uni.reLaunch 或 uni.switchTab

如果 condition 配置有问题，可以尝试使用 uni.reLaunch 或 uni.switchTab 手动跳转到指定页面，看看是否能够正常加载。

uni.reLaunch({
  url: '/pages/index/index'
});
回到顶部