《鸿蒙纪元》 是 张风捷特烈 计划打造的一套 HarmonyOS 开发系列教程合集。致力于创作优质的鸿蒙原生学习资源，帮助开发者进入纯血鸿蒙的开发之中。Flutter卷 是探讨基于 Flutter 跨平台技术，构建纯血鸿蒙应用的方式。帮助 Flutter 开发者完成一统七国的霸业。
一、资源准备
Flutter 最主流的跨平台开发框架之一，支持 Android、iOS、Windows、Macos、Linux、Web 六大平台。当你的应用恰好用 Flutter 构建，此时又需要支持鸿蒙版，该怎么做呢？单独使用 ArkUI 再写一份感觉有些得不偿失，你不禁感叹，如果使用 Flutter 可以构建鸿蒙应用，那世界将会多么美好。
好消息是：Flutter 可以支持鸿蒙坏消息是: 不是 Google 官方的 Flutter，而且目前最高版本是 3.22.0
1.鸿蒙版 Flutter 仓库
鸿蒙版 Flutter 由 OpenHarmony-SIG 维护，发布在 gitcode ：
2. 下载项目
首先，我们需要下载项目，并将其切到 3.22.1-ohos-1.0.0 标签，以此得到 鸿蒙版 Flutter SDK 环境
# 下载仓库
git clone https://gitcode.com/openharmony-sig/flutter_flutter.git
# 切换到 3.22.1-ohos-1.0.0 标签
cd flutter_flutter
git checkout 3.22.1-ohos-1.0.0
# 产看当前 flutter_ohos 环境
cd bin
.\flutter --doctor
如果出现了下面的问题，说明鸿蒙相关的环境没有配好：
其中 TOOL_HOME 是 DevEco-Studio 的地址。新版的 DevEco-Studio 中已经内置了 ohpm、node、hvigor 环境：
- macos 配置环境变量
# 拉取下来的flutter_flutter/bin目录
export PATH=/home/<user>/ohos/flutter_flutter/bin:$PATH
# HamonyOS SDK
export TOOL_HOME=/Applications/DevEco-Studio.app/Contents
export DEVECO_SDK_HOME=$TOOL_HOME/sdk
export PATH=$TOOL_HOME/tools/ohpm/bin:$PATH
export PATH=$TOOL_HOME/tools/hvigor/bin:$PATH
export PATH=$TOOL_HOME/tools/node/bin:$PATH
- windows 配置环境变量
TOOL_HOM = DevEco安装路径
DEVECO_SDK_HOME = %TOOL_HOME%\sdk
# Path 路径:
下载仓库路径\bin
%TOOL_HOME%\tools\ohpm\bin
%TOOL_HOME%\tools\hvigor\bin
%TOOL_HOME%\tools\node\bin
再查看一下，出现对钩即可。到这里，Flutter for 鸿蒙的环境就搭建完了。
二、Flutter&鸿蒙 初体验
环境搭建好了，鸿蒙版 Flutter SDK 和 Google flutter SDK 的命令是一样的。现在创建一个项目试试
1.创建新项目
下面创建一个 counter 的项目，会发现其中会多一个 ohos 的文件夹，这就是原生的鸿蒙宿主项目：
flutter create counter
2. 编译 har 包
har 包是鸿蒙原生的依赖库，需要先编译出来才能运行。会出现 异常集录 第二点，详见附录。
flutter build hap --release
产物在 ohos/entry/build 文件夹下：
3. 运行项目
AndroidStudio 无法感知鸿蒙设备，而 DevEco Studio 没有 Flutter 插件，使用也无法直接运行 Flutter 项目，这就一根筋变两头堵了。可以通过命令行运行到鸿蒙设备上：
flutter run --debug -d
<deviceId>
其中设备的 id 可以通过下面命令查找，如下所示 deviceId 是 23E0224127000257：
flutter devices
Found 4 connected devices:
23E0224127000257 (mobile) • 23E0224127000257 • ohos-arm64 • Ohos OpenHarmony-5.0.3.135 (API 15)
Windows (desktop) • windows • windows-x64 • Microsoft Windows [版本 10.0.26100.4061]
Chrome (web) • chrome • web-javascript • Google Chrome 136.0.7103.93
Edge (web) • edge • web-javascript •
这样，就可以在真机上跑起来计数器项目，没有真假也可以使用模拟器。
另外，在打出 har 包后，也可以通过 DevEco Studio 打开 ohos 项目运行。这就相当于用 Android Studio 打开 android 文件夹，可以调试原生代码，但是无法调试 Flutter 代码。
三、那代价呢？
虽然鸿蒙版的 Flutter 可以跑，但目前来看还有些小问题。
1. 命令行工具冲突
首先 鸿蒙版Flutter 和 Google Flutter 是两个东西, 所以同一时刻命令行里只能识别一个 flutter 命令。虽然可以用 fvm 切换 flutter 环境，但切来切去也挺麻烦。 既然两个是不同的东西，为什么非得叫一样的名字？
所以我的方式是: 把可执行文件名改一下，叫 hflutter, 这样编译鸿蒙相关的使用 hflutter 命令即可，也不会对现有的 Flutter 开发产生任何影响：
2. 鸿蒙版Flutter目前只到 3.22.0
由于是两个不同的东西，而且鸿蒙 Flutter 和核心还是依赖 Google Flutter。所以版本的同步更新是一个非常大的问题。如果你已有的项目已经适配了高版本 Flutter ，那为了鸿蒙的支持而降低版本，就显得有些不优雅。
希望后续鸿蒙版Flutter 可以持续适配，尽早升到 Flutter 3.27 这个稳定版本。
3. 插件兼容性问题
由于和原生交互的插件需要宿主平台提供渠道方法，而 pub 上的库一般都不会支持鸿蒙。所以三方库的生态是个很大的问题。但目前来看，很多高频使用的三方库已经可以支持鸿蒙 《Flutter高频使用的三方库（部分OpenHarmony化）列表》。但是这个支持仅是基于 git 仓库访问。直接使用 pub 仓库的依赖是不行的，这也为三方库的维护带来了一定的压力。
尾声
不管怎么说，现在已经能跑了。鸿蒙版 Flutter 已经迈出了坚实的第一步，有了这个 1 的质变 ，后面就是量变的积累。如果鸿蒙的设备未来有好好的生态，鸿蒙版Flutter 能够合并到 Google Flutter，这可谓一桩美谈。那本文就到这里，以后我会陆续将已有的 Flutter 项目支持鸿蒙版，其中有什么坑的话，我也会记录分析。本文就到这里，谢谢观看 ~
更多文章和视频知识资讯，大家可以关注我的公众号、掘金和 B 站 。关注 公众号 并回复 鸿蒙纪元 可领取最新的 xmind 脑图电子版，让我们一起成长，变得更强。我们下次再见~
附录: 异常集录
1. node 版本问题:
如果电脑中已经有了node ，或者通过 nvm 管理 node 版本，且当前 node 版本过低，会出现这个错误。
解决方案: 使用 16 + 的 node
>> nvm list
18.18.0
* 14.20.0 (Currently using 64-bit executable)
>> nvm use 18.18.0
2. 配置调试签名
使用 DevEco Studio 打开 ohos 项目，在 File/Project Structure/Signing Configs 中生成并配置签名。
