HarmonyOS 鸿蒙Next中previewer失败

HarmonyOS 鸿蒙Next中previewer失败

"F:\huawei\DevEcoStudio\DevEco Studio\tools\node\node.exe" "F:\huawei\DevEcoStudio\DevEco Studio\tools\hvigor\bin\hvigorw.js" --mode module -p module=entry@default -p product=default -p pageType=page -p compileResInc=true -p previewMode=true -p buildRoot=.preview PreviewBuild --watch --analyze=normal --parallel --incremental --daemon

> hvigor connect error: Connection between client is disconnected with a connect error:io.socket.engineio.client.EngineIOException: websocket error

> hvigor connect error: This is an error caused by hvigor daemon.

> hvigor A log of daemon process can be found in: C:\Users\wutongyu\.hvigor\daemon\log\6.22.3\daemon-21408.log

Process finished with exit code -1

更多关于HarmonyOS 鸿蒙Next中previewer失败的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

开发者您好，您可以根据以下方法排查下问题：

  1. 是否工程问题，预览的页面单独抽取出来，新建一个工程是否可以运行，以及工程使用模拟器或者测试设备是否有问题，排查下是否工程其他地方错误导致的无法预览；

  2. 检查是否使用了@prop，@Consume，@Link，@ObjectLink未明确初始化变量的装饰器。因为这些装饰器需要从父组件获取参数，直接预览子组件无法打通数据传递链路，所以预览失败，只有对外层组件没有参数诉求的组件才能预览。这种场景可以自定义⼀个父容器（并通过父容器传递合适的数据）来预览。详情参考预览数据模拟。

  3. 如果是inspector双向预览场景，检查要预览的组件是被@Entry还是@Preview修饰，@Entry支持inspector，@Preview不支持。观察是否能正常生成组件树，如果可以正常生成组件树，说明渲染正常；否则就需要收集预览器日志（Help -> Compress Logs and Show In Explorer）进一步分析渲染失败的原因。

  4. 是否引用了HSP。引用了HSP的模块不支持预览，需要直接在HSP内预览或模拟HSP，参考为HSP设置Mock实现。

  5. 清除缓存（File->Invalidate Caches…），重启IDE。

  6. 检查预览器是否使用了不支持的API：支持使用预览器的API清单，项目是否需要请求网络，是否使用自定义弹窗。预览器暂不支持这些场景，建议使用模拟器/真机调试。

如果上诉方法均为解决问题，开发者也请提供以下信息：

  1. 版本信息（DevEco Studio的版本信息）；

  2. 预览页面demo，方便请提供下预览页面的代码，方便定位下问题；

更多关于HarmonyOS 鸿蒙Next中previewer失败的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


请真机或模拟器，

在HarmonyOS Next中，previewer失败通常与预览器组件依赖缺失或配置错误有关。请检查项目配置中是否正确定义了预览组件，并确保预览器依赖已正确添加到模块的build-profile.json5文件中。同时，确认预览器版本与当前DevEco Studio及SDK版本兼容。

根据您提供的日志信息，预览器（previewer）启动失败的主要原因是 hvigor 守护进程（daemon）连接异常，具体错误是 websocket error 导致客户端连接断开。这通常与网络代理、防火墙或环境配置冲突有关。

核心解决步骤：

  1. 重启hvigor守护进程（首选方法）： 关闭DevEco Studio，直接打开系统任务管理器，结束所有名为 hvigor 或 node 的进程。然后重新打开DevEco Studio和项目，再次尝试预览。这能解决大部分因守护进程状态异常导致的问题。

  2. 检查网络代理与防火墙： 如果您配置了网络代理，请确保DevEco Studio、Node.js及系统代理设置一致，或尝试在无代理环境下运行。同时，临时禁用防火墙或安全软件，确认是否是其阻止了 hvigor 进程的本地WebSocket通信（端口通常为9970、9980等）。

  3. 清理并重建项目： 在DevEco Studio中，执行菜单栏的 Build > Clean Project，然后 Build > Rebuild Project。这可以清除可能损坏的临时构建文件。

  4. 检查Node.js环境： 确保DevEco Studio使用的Node版本（在 DevEco Studio/tools/node 目录下）是干净且兼容的。如果系统全局安装了其他Node版本，可能存在冲突。可以尝试暂时重命名系统环境变量中的其他Node路径，或使用Studio自带的Node环境。

  5. 查看详细日志： 按照日志提示的路径 C:\Users\wutongyu\.hvigor\daemon\log\6.22.3\daemon-21408.log 打开守护进程日志文件，查找 error 或 Exception 关键词，可能会提供更具体的错误原因（如端口占用、权限不足等）。

直接操作建议： 按顺序执行步骤1（重启进程）和步骤3（清理项目），这是最快且最常有效的解决方法。如果问题依旧，再重点进行步骤2（网络检查）和步骤4（环境检查）。多数情况下，重启守护进程和清理项目即可恢复预览功能。

回到顶部