鸿蒙flutter 老项目到新项目的遇到迁移坑点

1.下载鸿蒙官方的编辑器和虚拟机(需要提前安装java)

https://developer.huawei.com/consumer/cn/download/

下方链接为环境搭建指导

https://gitcode.com/openharmony-tpc/flutter_samples/blob/master/ohos/docs/03_environment/openHarmony-flutter环境搭建指导.md

2.下载flutter

https://gitcode.com/openharmony-tpc/flutter_flutter git clone到本地的目录,目录不要带有中文

注:编辑器和flutter sdk 最好在同一磁盘 如(D盘或者C盘)

3.设置环境变量

打开终端

国内镜像

js 复制代码
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

# 拉取下来的flutter_flutter/bin目录
export PATH=/Users/admin/ohos/flutter_flutter/bin:$PATH

# OpenHarmony SDK
export TOOL_HOME=/Applications/DevEco-Studio.app/Contents # mac环境
export DEVECO_SDK_HOME=$TOOL_HOME/sdk # command-line-tools/sdk
export PATH=$TOOL_HOME/tools/ohpm/bin:$PATH # command-line-tools/ohpm/bin
export PATH=$TOOL_HOME/tools/hvigor/bin:$PATH # command-line-tools/hvigor/bin
export PATH=$TOOL_HOME/tools/node/bin:$PATH # command-line-tools/tool/node/bin
export HDC_HOME=$TOOL_HOME/sdk/default/openharmony/toolchains # hdc指令(可选)

# 可选配置项(使用Android Studio 或者 Visual Studio Code调试时需要配置此项,jdk版本为17.0.12)
JAVA_HOME=/Users/admin/Documents/JDK/jdk-17.0.12.jdk/Contents/Home
PATH=$JAVA_HOME/bin:$PATH:.
export JAVA_HOME
export PATH

# 可选配置项(防止由于Flutter OpenHarmony版的git下载地址环境变量不匹配,影响后续的flutter项目创建)
export FLUTTER_GIT_URL=https://gitcode.com/openharmony-tpc/flutter_flutter.git

# 非必选配置项(若command-line-tools目录下的tool文件里存在node环境,则无需配置,若无则可进行如下单独配置)
# export NODE_HOME=/Users/admin/node/node-18.14.1
# export PATH=$PATH:$NODE_HOME/bin
window参考以上及设置系统变量
PUB_HOSTED_URL = https://pub.flutter-io.cn
剩下的参考以上

flutter doctor -v检查flutter运行环境

出现这些表示成功

4.创建项目

创建工程 方式一 该方式只创建了ohos平台 老项目可运行这个,直接安装ohos包

flutter create --platforms ohos

创建工程 方式二 该方式创建了android,ios,ohos三个平台

flutter create

进入工程根目录编译hap包

flutter build hap --debug

然后 flutter pub get

flutter run

会遇到一些报错

第一 检查环境变量设置是否正确

第二 检查node环境是否是18以上版本, 必须18以上版本,如有问题,切换到18版本

第三 检查flutter sdk 和 开发工具是否在同一目录,如不在同一目录,在flutter skd的同一目录下方增加,pubcache 文件,然后加入环境变量 ,如flutter sdk在 d盘第一目录, pubcache也要在第一目录

解决上面版本后,基本就搭建好了

3.第三方包的一些坑

鸿蒙目前所支持第三方包的版本

https://gitcode.com/openharmony-tpc/flutter_packages

鸿蒙支持的包不是很多,所以新项目可以直接搭建,老flutter项目建议切换分支后重新搭建

有一些第三包,需要安装鸿蒙的git包,参考以下

还有一些比如flutter_echarts的原生基础库依赖于原生的webview_flutter,所以需要以下设置

dependency_overrides:

webview_flutter:

git:

url: "https://gitcode.com/openharmony-tpc/flutter_packages.git"

path: "packages/webview_flutter/webview_flutter"

基本上从0到一的坑如上所述,对比鸿蒙安卓,要相当于简单一些

相关推荐
jin12332223 分钟前
基于React Native鸿蒙跨平台地址管理是许多电商、外卖、物流等应用的重要功能模块,实现了地址的添加、编辑、删除和设置默认等功能
javascript·react native·react.js·ecmascript·harmonyos
2601_9499757936 分钟前
Flutter for OpenHarmony艺考真题题库+帮助中心实现
flutter
2501_9209317042 分钟前
React Native鸿蒙跨平台医疗健康类的血压记录,包括收缩压、舒张压、心率、日期、时间、备注和状态
javascript·react native·react.js·ecmascript·harmonyos
2501_920931702 小时前
React Native鸿蒙跨平台使用useState管理健康记录和过滤状态,支持多种健康数据类型(血压、体重等)并实现按类型过滤功能
javascript·react native·react.js·ecmascript·harmonyos
2501_921930832 小时前
高级进阶 React Native 鸿蒙跨平台开发:InteractionManager 交互优化
react native·harmonyos
前端不太难2 小时前
HarmonyOS PC 文档模型完整范式
华为·状态模式·harmonyos
子春一3 小时前
Flutter for OpenHarmony:构建一个 Flutter 井字棋游戏,深入解析状态驱动逻辑、胜利判定与极简交互设计
flutter·游戏·交互
雨季6664 小时前
Flutter 三端应用实战:OpenHarmony “极简手势轨迹球”——指尖与屏幕的诗意对话
开发语言·javascript·flutter
ujainu4 小时前
Flutter + OpenHarmony 游戏开发进阶:CustomPainter 手绘游戏世界——从球体到轨道
flutter·游戏·信息可视化·openharmony
ITUnicorn4 小时前
【HarmonyOS6】从零实现自定义计时器:掌握TextTimer组件与计时控制
华为·harmonyos·arkts·鸿蒙·harmonyos6