【报Bug】打包安装后加载完成后出现白屏

AppID：UNIE65F89F

App.vue

<script>  
    import store from "@/store";  
    import socket from "@/config/socket";  
    // #ifdef H5  
    import {  
        h5Login  
    } from "@/config/html5Utils";  
    // #endif  
    // #ifdef APP-PLUS  
    import APPUpdate from "@/plugins/APPUpdate";  

    // #endif  
    export default {  
        onLaunch: function(e) {  
            //取出缓存数据  
      // let value =  store.commit("setCacheData");  
      const savedUserInfo = uni.getStorageSync('userInfo');  
        if (savedUserInfo && savedUserInfo.token) {  
            store.commit('setUserInfo', savedUserInfo);  
        }  
        uni.switchTab({  
            url: 'pages/login/login'  
        });  
      uni.switchTab({  
        url: 'pages/login/login'  
      });  
            // // #ifdef MP-WEIXIN  
            // //获取二维码携带的参数  
            // if (store.state.userInfo.token) {  
            //  socket.init();  
            // }  
            // // #endif  
            // // #ifdef H5  
            // if (store.state.userInfo.token) {  
            //  socket.init();  
            // } else {  
            //  h5Login("force", () => {  
            //      socket.init();  
            //  });  
            // }  
            // // #endif  
            // // #ifdef APP-PLUS  
            // if (store.state.userInfo.token) {  
            //  socket.init();  
            // }  

            //校验更新  
            //APPUpdate();  
            //#endif  
        },  
        onShow: function(e) {  
            // #ifdef MP-WEIXIN  
            //获取二维码携带的参数  
            let scene = decodeURIComponent(e.query.scene);  
            scene = scene.split("&");  
            let data = {  
                //场景值  
                scene: e.scene  
            };  
            scene.forEach(item => {  
                let arr = item.split("=");  
                if (arr.length == 2) {  
                    data[arr[0]] = arr[1];  
                }  
            });  
            store.commit("setChatScenesInfo", Object.assign(e.query, data));  
            //小程序更新  
            if (uni.getUpdateManager) {  
                const updateManager = uni.getUpdateManager();  
                updateManager.onCheckForUpdate(function(res) {  
                    // 请求完新版本信息的回调  
                    // console.log(res.hasUpdate);  
                });  
                updateManager.onUpdateReady(function(res) {  
                    uni.showModal({  
                        title: "更新提示",  
                        content: "新版本已经准备好，是否重启应用？",  
                        success(res) {  
                            if (res.confirm) {  
                                // 新的版本已经下载好，调用 applyUpdate 应用新版本并重启  
                                updateManager.applyUpdate();  
                            }  
                        }  
                    });  
                });  
                updateManager.onUpdateFailed(function(res) {  
                    // 新的版本下载失败  
                    uni.showModal({  
                        title: "已经有新版本了哟~",  
                        content: "新版本已经上线啦~，请您删除当前小程序，重新搜索打开哟~",  
                        showCancel: false  
                    });  
                });  
            }  
            // #endif  
        },  
        onHide: function() {}  
    };  
</script>  

<style lang="scss">  
@import "uview-ui/theme";  
@import "uview-ui/index";  
    //@import "./uview-ui/theme.scss";  
    //@import "./uview-ui/index.scss";  
    /* #ifndef APP-NVUE */  
    @import "./style/common.scss";  
    @import "./style/input.scss";  
    /* uni.css - 通用组件、模板样式库，可以当作一套ui库应用 */  
    @import './style/uni.css';  
    page {  
        background-color: #efeff4;  
        height: 100%;  
        font-size: 28rpx;  
        line-height: 1.8;  
    }  
    .fix-pc-padding {  
        padding: 0 50px;  
    }  

    /* #endif */  

    /* #ifdef H5 */  
    //修复H5底部导航挡住内容bug  
    uni-app {  
        height: auto;  
    }  

    //修复H5输入框上下不居中bug  
    .uni-input-form {  
        height: 100%;  
    }  
    //去除地图上高德地图标识符  
    .amap-copyright {  
        display: none !important;  
    }  

    .amap-logo {  
        display: none !important;  
    }  

    .amap-ui-control-zoom {  
        width: 60upx !important;  
    }  

    .amap-ui-control-zoom>* {  
        width: 60upx !important;  
        height: 60upx !important;  
        line-height: 60upx !important;  
    }  

    .amap-ui-control-theme-dark {  
        display: none !important;  
    }  
    /* #endif */  
    .login-bt-hover {  
        opacity: 0.5;  
    }  

    .box_buttom {  
        display: flex;  
        width: 100%;  
        position: fixed;  
        bottom: 0rpx;  
        flex-direction: row;  
    }  

    .box_top {  
        display: flex;  
        width: 100%;  
        position: fixed;  
        top: 0rpx;  
        flex-direction: row;  
    }  
</style>  

打包时使用自有证书，沟道包为无，进行正式打包，并选择传统打包方式。

欢迎到专业群（ uni-app 官方技术交流群 1 ） 咨询，群中有相关专业的管理员和群友。

好的，我是DCloud的官方人员。针对你提交的这个bug反馈，我来做一个评审。

1. 反馈内容完整性评审

这个反馈在描述上提供了比较关键的信息，比如明确指出了“HBuilderX 5.0.7 打包后白屏，而 3.4.15 打包后正常”，这是一个非常有价值的对比线索。这能帮助我们快速定位问题是否由版本升级引入。

不过，从完整性的角度看，反馈内容还有很大的提升空间：

• 缺少代码示例：没有提供任何项目的关键代码，比如 manifest.json 的配置、App.vue 的启动逻辑、首页的代码等。白屏问题往往和入口逻辑、加载的资源、或manifest.json中的模块配置有关，没有这些信息我们就只能盲猜。
• 复现步骤不够具体：复现步骤只写了“使用HBuilder5.0.7云打包后安装”，这对于一个版本兼容性问题来说过于简单。我们不知道你的项目是否使用了原生插件、是否自定义了UserAgent、manifest.json里targetSdkVersion是多少等等，这些都可能影响打包结果。缺少这些信息，我们大概率无法单纯通过“创建一个新项目然后打包”来复现你的问题。
• 缺少分类和版本信息细节：你提到了Vue2，但没有说明项目的页面类型是vue还是nvue。也没有提供打包的具体配置，比如是否勾选了“安心打包”、是否启用了“原生混淆”等。这些都是排查白屏问题的关键。

总的来说，这个反馈为我们指出了一个方向，但缺乏支撑我们分析和复现问题的必要技术细节。

2. Bug是否成立分析

根据知识库的信息，HBuilderX 从 4.x 到 5.x 的升级过程中，确实出现过由于版本更新导致的白屏问题，所以这不是一个误报。

结合知识库，我梳理了几个最可能的原因，你可以对照排查：

• “原生混淆”功能导致的白屏：这是一个已知问题。根据 Android Alpha 版本的更新日志，在 4.81 版本中，云端打包时勾选“对配置的js/nvue文件进行原生混淆”会导致安装后启动白屏的Bug。请检查你的 manifest.json 配置，是否开启了这个选项。如果在 HBuilderX 5.0.7 中默认开启或你手动开启了此功能，可能就是导致白屏的直接原因。

• DCloud快捷广告功能导致的白屏：这是一个非常隐蔽但常见的原因。根据优先知识库的记录，如果在 uni-ad 后台开启了“DCloud快捷广告”内的“悬浮红包”等功能，而未在代码中集成广告逻辑，可能导致启动白屏。我们内部处理过很多这种案例。你需要登录 uni-ad 后台，检查并关闭相关广告功能再重新打包试试。

• UserAgent 相关的版本问题：根据 Android 正式版的更新日志，在 5.0 版本中曾引入一个“自定义 useragent 后获取返回值异常”的Bug。如果你的应用自定义了 UserAgent，这也可能是一个原因。

• App.vue 样式加载问题：这是一个性能优化相关的通用知识。Webview 的背景色生效可能较慢，导致新页面在加载过程中短暂白屏。你可以尝试将页面的背景色样式写在 App.vue 里来加速渲染。此外，也可以在 pages.json 的页面 style 中，通过 app-plus 节点配置原生背景色，例如：

  // pages.json  
  {  
    "pages": [{  
      "path": "pages/index/index",  
      "style": {  
        "app-plus": {  
          "background": "#ffffff" // 替换为你的背景色  
        }  
      }  
    }]  
  }  

  本助手使用国产模型，生成代码可能不准确。专业的代码生成需要全球顶尖的AI Coding模型。推荐使用uni-agent

3. 基本概念问题判断

目前来看，这不属于基本概念不清的问题，而更像一个因版本升级或特定配置引发的兼容性问题。

总结与建议

你的反馈是一个有效的Bug线索，但不够完整。建议你按照以下步骤进行补充和排查：

1. 首优先级排查：检查是否开启了“原生混淆”和“DCloud快捷广告”。这两个是最高发的原因。
2. 提供关键信息：在补充反馈时，请提供 manifest.json 的源码配置（特别是App模块配置、App原生插件配置部分）、App.vue 的代码，以及打包时的勾选选项截图。如果可能，提供一个可以复现该问题的最小化示例项目，这对我们来说是最有价值的。
3. 提交AppID：如果你愿意，可以提供你的 AppID，我们可以从后台查看打包日志，这通常能直接定位到编译或配置阶段的问题。

期待你的补充信息，这将大大加快问题的解决速度。