Hbuilder X 打包后运行到鸿蒙云真机出现白屏，如果只有一个页面就没有问题，多个页面就有白屏

开发者你好，白屏的问题是因为JS引擎在执行代码的时候报错了，可能是方法不支持也可能是写法上存在兼容性问题，可以参考这篇文章uni-app调试说明，最重要的是文章最后部分的说明。

以下是uni-app白屏问题定位参考方案：

【问题定位】

定位步骤：

1. 排查以下3种场景。

   条件编译未命中HarmonyOS平台。

   页面元素受v-if、v-show、样式影响没有渲染，可通过DevTools查看元素是否挂载到DOM树上。

   请求数据的方法未执行。

2. 观察HBuilder报错。

3. 运行到浏览器，通过F12查看是否有报错。

4. 打开deveco，过滤应用和日志级别，检查关键错误。

5. 通过JSVM调试查看页面是否有报错。

6. 在pages.json中注释页面，通过二分法定界。
   收起

   自动换行

   深色代码主题

   复制

   {
     "pages": [     
       {
         "path": "pages/index/index",
         "style": {
           "navigationStyle":"custom"  ,
           "navigationBarTitleText": "index"
         }
       },
       {
         "path": "pages/index2/index2",
         "style": {
           "navigationStyle":"custom"  ,
           "navigationBarTitleText": "index2"
         }
       },
       {
         "path" : "pages/webview/webview",
         "style" : {
           "navigationBarTitleText" : "huawei"
         }
       }
     ]
   }

7. 通过JSVM调试调试JS代码。
   在JSVM调试中能看到app-service.json包含了uniapp逻辑转译后的代码。参考第4步，可主动打断点调试。

【分析结论】
通过HbuilderX、浏览器开发者工具、DevEco Studio的日志可以获取一些明显的错误信息然后解决。uni-app插件可能在JS引擎未执行加载页面的代码时就运行出错导致白屏，可以在JSVM调试时提前勾选遇到异常自动断点即可定位到运行出错前的代码。最后还没解决可以通过二分法注释关键文件定界白屏原因。

【常见FAQ】
Q：JSVM调试加载不出源码怎么办？
A：请参考解决方案

• 如果还是不能加载源码，可能是在加载源码前就抛出异常，可按JSVM调试的4、5、6步骤，打开调试页面，勾选Pause on uncaught exceptions和Pause on caught exceptions。可自动断点在异常抛出之前的位置。

Q：运行hdc命令报错提示找不到hdc命令。
A：hdc命令工具在DevEco Studio目录下，路径为：${DevEco Studio安装目录}\sdk\default\openharmony\toolchains。将此路径配置为环境变量即可。

Q：devtools调试JS代码，根据堆栈信息定位到Vue全局对象app报错undefined，下一步如何分析？
A：观察报错的第一场景，如果是媒体资源（图片，视频等），在项目中搜索该媒体资源是否作为对象导出，导出后在css、JS中使用不当，也会导致加载全局对象app异常，从而项目出现白屏问题。

【背景知识】

1. uniapp项目页面使用webview渲染，js业务逻辑运行在uniapp定制的jsvm中。两者实现由uniapp官方开发，当前闭源。

1. 开发态uniapp项目的目录结构如下：