鸿蒙 PC 开发环境对比Electron vs Qt各跑一个最小 Demo 看完你就懂了欢迎加入开源鸿蒙 PC 社区https://harmonypc.csdn.net/本文同时跑通两个鸿蒙 PC 桌面应用开发路线的最小 Demo——Qt 自研 Hello World 和 Electron Markdown 编辑器。所有数据来自真实操作给你一份我到底该选哪条路的决策参考。项目信息说明项目内容本文目的横向对比 Electron 和 Qt 两条鸿蒙 PC 开发路线对比维度环境搭建 / 工具链 / 难度 / 最小 Demo 工时 / 适用场景Electron 侧素材淼学派对的 Electron 环境搭建 markdownify 迁移实战Qt 侧素材仓库的 OpenCloudOS 9 构建 Qt 交叉编译服务器 IronLog 自研实战目标读者即将做鸿蒙 PC 桌面应用、但不知道选 Electron 还是 Qt 的工程师一、先讲结论给所有怕看长文的人你是推荐路线理由前端开发者React / Vue / 熟悉 JS✅Electron业务代码零改动半天上鸿蒙C 桌面开发者Qt / MFC / Win32 背景✅Qt工具链熟、性能好、原生集成深跨平台维护者已有 Electron 桌面应用想搬到鸿蒙 PC✅Electron同一套代码三个平台共享重型桌面应用开发IDE / 设计工具 / 视频处理✅Qt性能 系统级集成上限更高完全新手⚠️ 看你想学什么栈但Electron 入门门槛低不要 Linux 服务器核心区别一句话Electron是把 Web 应用塞进鸿蒙容器跑——产物是 HAP门槛是前端。Qt是把 C 桌面应用交叉编译成 .so 塞进 HAP——产物也是 HAP门槛是 C 交叉编译。二、环境搭建对比表这是最关键的一张表——两条路第一天要做的事完全不一样。维度Electron 路线Qt 路线是否需要 Linux 服务器❌ 不需要纯 Mac/Win 本地✅ 必须做交叉编译要装的本地工具DevEco Studio Node.js v18DevEco Studio要装的服务器工具❌ 无OHOS SDK 2.5 GB Qt-OHOS 622 MB cmake/ninja/patchelf关键依赖libelectron预编译包华为云下载OHOS Native SDK Qt for HarmonyOS 5.12.12依赖总大小~500 MB~4 GB下载时长国内5-10 分钟8-15 分钟华为云镜像首次环境搭建工时30 分钟到 1 小时30 分钟到半天环境踩坑数主要是签名1-2 个host 工具 .exe Qt5 找不到2-3 个官方文档完备度较好淼学派对系列博文较好特立独行的猫a 系列博文三、Demo #1Electron 最小应用30 分钟跑通跟着淼学派对的环境搭建文章走一遍。3.1 准备阶段15 分钟# 1. 装 Node.js v20.18.1如果还没装brewinstallnode20# 2. 下载 libelectron 预编译包# 浏览器打开# https://devcloud.cn-north-4.huaweicloud.com/codehub/.../electron34-release# 下载v34.6.0-20251105.1-release.zip# 3. 解压约 500MBunzipv34.6.0-*.zip# 4. 查看结构lslibelectron/# lib.unstripped/ ← Chromium so 库# ohos_hap/ ← 鸿蒙工程目录DevEco 打开这个不是 libelectron3.2 用 DevEco 打开 签名10 分钟1. DevEco Studio → File → Open → 选 libelectron/ohos_hap/ ⚠️ 不要打开 libelectron 根目录DevEco 不认 2. 等首次索引完成10-30 分钟看网速 3. File → Project Structure → Signing Configs - 勾选 Automatically generate signature - 登录华为账号 - 等 30 秒DevEco 自动填充 cert/profile/p12 路径 4. 检查 build-profile.json5 的 products.default.signingConfig: default 这是仓库 8 大坑里的 #6每次都要确认3.3 跑起来5 分钟# 1. 连接鸿蒙设备或模拟器hdc list targets# 2. DevEco 点 ▶️ Run# 等 hap 包构建 安装 启动成功标志模拟器/真机上看到一个空白的 Electron 窗口——这就是最小可运行 Demo。3.4 加点业务代码10-30 分钟# 进入 Vue3 应用目录cdohos_hap/web_engine/src/main/resources/resfile/resources/app/vue-app# 开发模式浏览器预览不用鸿蒙设备npmrun dev# 浏览器打开 http://127.0.0.1:5173/# 写完业务后生产构建npmrun build# 产物自动放到 dist/被 HAP 加载到这里你已经会鸿蒙 Electron 开发了——业务全在 Vue3 项目里逻辑零改动鸿蒙这层只是个壳。四、Demo #2Qt 最小应用半天跑通跟着仓库的 OpenCloudOS 9 服务器环境搭建 走一遍。4.1 服务器环境30 分钟# SSH 登录 Linux 服务器OpenCloudOS 9 / Ubuntu 22sshrootxxx.xxx.xxx.xxx# 1. 装系统包yuminstall-ycmake ninja-build patchelf\qt5-qtbase-devel qt5-qttools-devel qt5-qtsvg-devel\rsyncgit-lfsunzip# 2. 下载 OHOS Native SDK2.5 GBwgethttps://repo.huaweicloud.com/openharmony/os/5.0.1-Release/ohos-sdk-windows_linux-public.tar.gztarxzf ohos-sdk-*.tar.gzunzipohos-sdk-extracted/linux/native-linux-x64-*.zip-d/root/ohos-sdk/12/# 3. 拉 Qt-OHOSgit lfs 517 MBgitlfsinstallmkdir-p/opt/qt-ohoscd/opt/qt-ohosgitclone https://gitcode.com/OpenHarmonyPCDeveloper/ohos_Qt5.12.12.git.unzipqt_ohos_release/qt-5.12.12-ohos_release_*.zip-dqt-5.12.12-ohos/# 4. 软链系统 Qt5 工具覆盖 Qt-OHOS 自带的 Windows .exe️ 坑 #1QT_BIN/opt/qt-ohos/qt-5.12.12-ohos/qt-5.12.12-ohos/binfortinmoc rcc uic lrelease qmake;domv$QT_BIN/${t}.exe$QT_BIN/${t}.exe.bakln-sf/usr/bin/${t}-qt5$QT_BIN/${t}.exedone# 5. 环境变量永久化echoexport OHOS_SDK_ROOT/root/ohos-sdk/12~/.bashrcechoexport QT_OHOS_ROOT/opt/qt-ohos/qt-5.12.12-ohos/qt-5.12.12-ohos~/.bashrcsource~/.bashrc4.2 写 Hello World15 分钟mkdir-phello-qt/srccdhello-qtsrc/main.cpp#includeQApplication#includeQLabelintmain(intargc,char*argv[]){QApplicationapp(argc,argv);QLabellabel(Hello, HarmonyOS PC Qt!);label.setStyleSheet(font-size: 24px; padding: 40px;);label.show();returnapp.exec();}CMakeLists.txtcmake_minimum_required(VERSION 3.16) project(hello_qt CXX) set(CMAKE_CXX_STANDARD 17) set(CMAKE_AUTOMOC ON) set(CMAKE_AUTORCC ON) set(CMAKE_AUTORCC_OPTIONS --no-compress) # ← 仓库 8 大坑里的 #4 find_package(Qt5 REQUIRED COMPONENTS Core Gui Widgets) add_library(hello_qt SHARED src/main.cpp) # ← SHARED 不是 executable target_link_libraries(hello_qt PRIVATE Qt5::Core Qt5::Gui Qt5::Widgets)4.3 交叉编译15 分钟mkdirbuild-ohoscdbuild-ohos cmake-GNinja\-DCMAKE_TOOLCHAIN_FILE$OHOS_SDK_ROOT/native/build/cmake/ohos.toolchain.cmake\-DOHOS_ARCHarm64-v8a\-DQt5_DIR$QT_OHOS_ROOT/lib/cmake/Qt5\-DCMAKE_FIND_ROOT_PATH$QT_OHOS_ROOT\-DCMAKE_FIND_ROOT_PATH_MODE_PACKAGEBOTH\..ninja# [4/4] Linking CXX shared library libhello_qt.so# 5 项产物体检filelibhello_qt.so# ARM aarch64 ✓$OHOS_SDK_ROOT/native/llvm/bin/llvm-nm-Dlibhello_qt.so|grep main$# T main ✓$OHOS_SDK_ROOT/native/llvm/bin/llvm-readelf-llibhello_qt.so|grepLOAD# 0x1000 ✓4.4 HAP 集成 DevEco Run30-60 分钟# 1. scp 拉回 Macscprootserver:/path/to/libhello_qt.so.# 2. 复制鸿蒙 QT 模板 → HelloQtOhos/cp-r鸿蒙QT模板/ HelloQtOhos/# 3. 把所有 .so 倒进 entry/libs/arm64-v8a/cplibhello_qt.so$QT_OHOS_ROOT/lib/libQt5*.so HelloQtOhos/entry/libs/arm64-v8a/# 4. 改 APP_LIBRARY_NAME / bundleName# 5. DevEco Studio 打开 → 自动签名 → Run成功标志模拟器/真机上看到 “Hello, HarmonyOS PC Qt!” 字样。五、两个 Demo 跑完后的真实数据对比维度Electron DemoQt Demo总工时30-50 分钟半天含服务器环境搭建从写代码到看到效果10 分钟1 小时首次代码量0 行用 Vue3 模板15 行C CMake要懂的概念数5 个DevEco / 签名 / hdc / npm / IPC12 个CMake / toolchain / sysroot / AUTOMOC / 4KB 对齐 / SHARED / dlsym main / NEEDED / patchelf / HAP / libqohos / Qt-OHOS bin .exe首次踩坑数1白屏 GPU 问题仅复杂 Demo 触发2-3host 工具 / Qt5 找不到 / 签名跨平台代码复用macOS / Win / Linux / 鸿蒙 共享仅鸿蒙同代码桌面 Qt 也能编但需要分别构建二次迭代速度npm run build 同步资源1-2 分钟修代码 → 服务器编 → 拉回 → DevEco Run5-15 分钟六、各自适合什么场景✅ Electron 适合已有 Web 应用想搬到鸿蒙 PCmarkdownify / marktext / VSCode Web 这类前端团队主导的鸿蒙 PC 应用JS/TS 工程师占主体快速验证 idea30 分钟出原型这件事 Qt 做不到UI 复杂度高、性能要求一般表单 / 编辑器 / 仪表盘类跨多个平台Win macOS Linux 鸿蒙 PC 同一套代码✅ Qt 适合C 桌面应用历史负担已有 Qt 桌面应用要搬鸿蒙性能敏感实时音视频、CAD、3D 渲染、IDE 这类系统级集成直接调系统 API、自绘大量复杂图形、低延迟交互重型应用LiteIDE / KDiff3 / QElectroTech 这种打包体积敏感Qt HAP 比 Electron HAP 通常小 30-40%❌ 各自的坑Electron 的真实陷阱⚠️ 整包大小Electron Runtime 自带 ChromiumHAP 体积常 100-200 MB⚠️ 启动速度要加载 Chromium 进程冷启动 1-3 秒⚠️ GPU 白屏坑鸿蒙壳工程CommandLineAdapter.ets默认--use-glegl会闪退要改--use-gldisabled淼学派对 markdownify 那篇踩过⚠️ 原生能力调用要懂 IPC preload对纯前端有学习曲线Qt 的真实陷阱⚠️ 必须有 Linux 服务器云服务器至少 2 核 4G⚠️ Qt-OHOS host 工具是 Windows.exe要软链系统 Qt5⚠️ moc ABI 5.15 vs 5.12 错位复杂项目要写 perl 脚本批量降级⚠️ 4KB vs 64KB 页对齐新版 Qt-OHOS 已修但老资料还在提醒⚠️ 8 大坑全套都要趟一遍七、决策树到底选哪条你要在鸿蒙 PC 做什么 | ---------------------- | | 已有 Web 应用 已有 C 桌面应用 /想搬过来 /想搬过来 | | Electron Qt markdownify KDiff3 / DiffPDF 套路 套路 | | OR从 0 开发新应用 | ---------------------- | | 前端 / 全栈背景 C 桌面背景 | | Electron Qt | | OR又是新人没背景 | 你想学什么栈 ---------------------- | | 学 Web 学 C/系统编程 | | Electron Qt 入门 30 分钟 入门半天 | | 性能 / 体积 要求高吗 ---------------------- | | 不在意 在意 | | Electron Qt八、我个人的两条路推荐顺序如果你只有一个周末跑通一条路→选 Electron。30 分钟出第一个能跑的 HAP剩下时间写业务。如果你有一周→两条都试一下。Electron 第 1 天 Qt 第 2-5 天对鸿蒙 PC 桌面整个生态会有立体感受。如果你打算长期投入鸿蒙 PC 开发→两条都要会。鸿蒙 PC 桌面生态的未来不会只有一条路——大部分应用走 Electron拼 UI 速度少数性能敏感的走 Qt拼能力上限。九、关键参考链接Electron 路线鸿蒙版本 Electron 框架环境搭建并实现 XH 笔记应用 · 淼学派对Electron 入门第一篇electron-markdownify 从普通 Electron 迁移到 OpenHarmony Electron HAP 的完整实践 · 淼学派对marktext-develop 鸿蒙适配全记录 · 淼学派对Electron 开源框架下实际鸿蒙 PC 应用开发——AI 英语单词记忆卡实战 · 红目香薰厨房里的化学生态用鸿蒙 PC 的 Electron 框架实现——上架操作全流程 · 红目香薰上架流程Qt 路线鸿蒙 PC 生态三方软件移植开发环境搭建及三方库移植指南 · 特立独行的猫a环境搭建第一篇Qt 开源软件 DiffPDF 适配鸿蒙 PC 全流程实战 · 一键难忘Qt 移植第一篇HarmonyOS 鸿蒙 PC 端 Qt 应用开发第三方 Qt 开源软件移植指南 · 特立独行的猫aHarmonyOS 鸿蒙 PC 开源 QT 软件移植基于 Qt Widgets 的网络调试助手工具 · 特立独行的猫aQt Widgets demo十、写在最后Electron 和 Qt 不是对手是互补——它们覆盖鸿蒙 PC 应用生态的不同象限Electron拉低门槛让前端社区涌入鸿蒙Qt拉高上限让重型桌面应用搬过来我自己用了 10 年 Qt最近做完 10 个 Qt 适配项目后开始研究 Electron——两条路我都建议会一点。任何一个想长期做鸿蒙 PC 开发的人都会发现你的下一个项目可能因为 UI 简单选 Electron再下一个因为性能要求高选 Qt。生态需要两条腿走路开发者也需要。跑一遍最小 Demo 是最快的判断方式——花一个下午你就有答案了。本文所有 Electron 数据来自淼学派对、Dream-Y.ocean、红目香薰等社区开发者的实战博文Qt 数据来自仓库 10 个真实跑通的适配项目。