鸿蒙 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 v18+ | DevEco 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 #1：Electron 最小应用（30 分钟跑通）
跟着淼学派对的环境搭建文章走一遍。
3.1 准备阶段（15 分钟）
# 1. 装 Node.js v20.18.1（如果还没装）brewinstallnode@20# 2. 下载 libelectron 预编译包# 浏览器打开：# https://devcloud.cn-north-4.huaweicloud.com/codehub/.../electron34-release# 下载：v34.6.0-20251105.1-release.zip# 3. 解压（约 500MB）unzipv34.6.0-*.zip# 4. 查看结构lslibelectron/# lib.unstripped/ ← Chromium so 库# ohos_hap/ ← 鸿蒙工程目录（DevEco 打开这个！不是 libelectron）3.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 #2：Qt 最小应用（半天跑通）
跟着仓库的 OpenCloudOS 9 服务器环境搭建 走一遍。
4.1 服务器环境（30 分钟）
# SSH 登录 Linux 服务器（OpenCloudOS 9 / Ubuntu 22）sshroot@xxx.xxx.xxx.xxx# 1. 装系统包yuminstall-ycmake ninja-build patchelf\qt5-qtbase-devel qt5-qttools-devel qt5-qtsvg-devel\rsyncgit-lfsunzip# 2. 下载 OHOS Native SDK（2.5 GB）wgethttps://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-OHOS（git lfs 517 MB）gitlfsinstallmkdir-p/opt/qt-ohos&&cd/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（🕳️ 坑 #1）QT_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. 环境变量永久化echo"export OHOS_SDK_ROOT=/root/ohos-sdk/12">>~/.bashrcecho"export QT_OHOS_ROOT=/opt/qt-ohos/qt-5.12.12-ohos/qt-5.12.12-ohos">>~/.bashrcsource~/.bashrc4.2 写 Hello World（15 分钟）
mkdir-phello-qt/src&&cdhello-qtsrc/main.cpp：
#include<QApplication>#include<QLabel>intmain(intargc,char*argv[]){QApplicationapp(argc,argv);QLabellabel("Hello, HarmonyOS PC + Qt!");label.setStyleSheet("font-size: 24px; padding: 40px;");label.show();returnapp.exec();}CMakeLists.txt：
cmake_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-ohos&&cdbuild-ohos cmake-GNinja\-DCMAKE_TOOLCHAIN_FILE=$OHOS_SDK_ROOT/native/build/cmake/ohos.toolchain.cmake\-DOHOS_ARCH=arm64-v8a\-DQt5_DIR=$QT_OHOS_ROOT/lib/cmake/Qt5\-DCMAKE_FIND_ROOT_PATH=$QT_OHOS_ROOT\-DCMAKE_FIND_ROOT_PATH_MODE_PACKAGE=BOTH\..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 Run（30-60 分钟）
# 1. scp 拉回 Macscproot@server:/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 Demo | Qt Demo |
|---|---|---|
| 总工时 | 30-50 分钟 | 半天（含服务器环境搭建） |
| 从写代码到看到效果 | 10 分钟 | 1 小时（首次） |
| 代码量 | 0 行（用 Vue3 模板） | 15 行（C++ + CMake） |
| 要懂的概念数 | 5 个（DevEco / 签名 / hdc / npm / IPC） | 12 个（CMake / toolchain / sysroot / AUTOMOC / 4KB 对齐 / SHARED / dlsym main / NEEDED / patchelf / HAP / libqohos / Qt-OHOS bin .exe） |
| 首次踩坑数 | 1（白屏 GPU 问题，仅复杂 Demo 触发） | 2-3（host 工具 / Qt5 找不到 / 签名） |
| 跨平台代码复用 | macOS / Win / Linux / 鸿蒙 共享 | 仅鸿蒙（同代码桌面 Qt 也能编但需要分别构建） |
| 二次迭代速度 | npm run build + 同步资源（1-2 分钟） | 修代码 → 服务器编 → 拉回 → DevEco Run（5-15 分钟） |
六、各自适合什么场景
✅ Electron 适合
- 已有 Web 应用想搬到鸿蒙 PC：markdownify / marktext / VSCode Web 这类
- 前端团队主导的鸿蒙 PC 应用：JS/TS 工程师占主体
- 快速验证 idea：30 分钟出原型这件事 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 自带 Chromium，HAP 体积常 100-200 MB+
- ⚠️ 启动速度：要加载 Chromium 进程，冷启动 1-3 秒
- ⚠️ GPU 白屏坑：鸿蒙壳工程
CommandLineAdapter.ets默认--use-gl=egl会闪退，要改--use-gl=disabled（淼学派对 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 开源软件移植指南 · 特立独行的猫a
- HarmonyOS 鸿蒙 PC 开源 QT 软件移植：基于 Qt Widgets 的网络调试助手工具 · 特立独行的猫a（Qt Widgets demo）
十、写在最后
Electron 和 Qt 不是对手，是互补——它们覆盖鸿蒙 PC 应用生态的不同象限：
- Electron：拉低门槛，让前端社区涌入鸿蒙
- Qt：拉高上限，让重型桌面应用搬过来
我自己用了 10 年 Qt，最近做完 10 个 Qt 适配项目后开始研究 Electron——两条路我都建议会一点。任何一个想长期做鸿蒙 PC 开发的人都会发现：
你的下一个项目可能因为 UI 简单选 Electron，再下一个因为性能要求高选 Qt。生态需要两条腿走路，开发者也需要。
跑一遍最小 Demo 是最快的判断方式——花一个下午，你就有答案了。
本文所有 Electron 数据来自淼学派对、Dream-Y.ocean、红目香薰等社区开发者的实战博文，Qt 数据来自仓库 10 个真实跑通的适配项目。
