Flutter鸿蒙化环境配置(windows)

Flutter鸿蒙化环境配置(windows)

参考资料

Flutter SDK 环境的配置参考相 flutter官网(https://docs.flutter.dev/get-started/install

Flutter鸿蒙化相关参考文档: https://gitee.com/openharmony-sig/flutter_flutter/tree/dev/

注意: 目前Flutter项目鸿蒙化,FlutterSDK的版本只支持3.7.12, Dart支持的版本是2.19.6

Window配置Flutter的鸿蒙化环境

如果是MAC电脑的话, 直接参考上述参考资料配置环境。

下载

  1. 首先我们需要下载HarmonyOS的套件,并安装相关的编译工具
  2. 2、 通过代码工具包下载当前仓库代码 git clone https://gitee.com/openharmony-sig/flutter_flutter.git, 并切换到dev分支

配置环境变量

HarmonyOS的环境变量配置

首先我们需要配置harmonyos中的node、ohpm、hvigor、hdc的环境变量, node、ohpm、hvigor这三个都在DevEco Studio软件安装的tools文件加下, 而hdc则是在sdk\HarmonyOS-NEXT-DB1\openharmony\toolchains 目录下。配置环境变量如下图:

在这里插入图片描述
同时我们还需要在系统环境变量中增加 HOS_SDK_HOME 也就是harmonyos的SDK的路径

在这里插入图片描述

配置Flutter的环境变量

在这里插入图片描述
注意:如果你之前有下载官方的FlutterSDK,那么这里配置的flutter_flutter的环境变量一定要在你自己下载的flutterSDK的环境变量之前(flutter_windows_3.7.12-stable\flutter\bin), 如果顺序发生调换, 你在使用flutter doctor –v检测环境时, 无法出现 HarmonyOS 的环境标志

除上述之外,我们还需在系统环境变量中配置一下几个环境变量:PUB_HOSTED_URL = https://pub.flutter-io.cn
在这里插入图片描述
FLUTTER_STORAGE_BASE_URL=https://flutter-ohos.obs.cn-south-1.myhuaweicloud.com
在这里插入图片描述
使用Flutter doctor –v 检测环境

环境检测通过示例,如下图:
在这里插入图片描述

Flutter doctor -v 检测的问题

flutter_flutter仓库地址的警告问题

在这里插入图片描述
解决方案:

在系统变量中增加如下环境变量即可解决

FLUTTER_GIT_URL=https://gitee.com/openharmony-sig/flutter_flutter.git

在这里插入图片描述

Fliutter doctor –v 报错[!] Android Studio (version 2024.1)✗ Unable to find bundled Java version.

在这里插入图片描述

  1. 首先进入android studio工具的安装目录
  2. 目录中没有jre目录, 你需要创建一个jre文件夹
  3. 然后把jbr目录中的所有内容复制到jre文件中

Windows上配置环境问题

Hvigor Error : BUILD unable to find “DEVECO_SDK_HOME” in the environment path

解决方案:
我们需要再系统环境变量中配置以下这个环境变量:
在这里插入图片描述

Hvigor depends on the npmrc file configure the npmrc file

在这里插入图片描述
原因: 是没有配置.npmrc文件
解决方案:需要该文件存在C盘当前用户目录(示例:C:\Users\issuser)下创建这个文件, 文件的内容是华为npm仓库的地址

在这里插入图片描述

404 GET https://registry.npm.js.org/xxxx not found

在这里插入图片描述
解决方案:
需要再.npmrc文件中配置下npm的仓库:

registry=https://repo.huaweicloud.com/repository/npm/
@ohos:registry=https://repo.harmonyos.com/npm/

注意:为什么有的需要配置这个,有的不需要配置,是因为有些库只发布到了https://repo.harmonyos.com/npm/

云桌面无法检测到真机设备的问题

  1. 首先验证云桌面和本地是否在同一网段,可以在云桌面ping 本机的ip地址
  2. 可以参考文档,使用hdc远程连接到设备: https://docs.openharmony.cn/pages/v4.0/zh-cn/device-dev/subsystems/subsys-toolchain-hdc-guide.md/#hdc-client%E5%A6%82%E4%BD%95%E8%BF%9C%E7%A8%8B%E8%AE%BF%E9%97%AEhdc-server
  3. 其次本地和云桌面需要配置hdc的环境配置变量
    在这里插入图片描述
  4. 注意:Hdc 在sdk的 D:\ProgrameFile\HuaWei\DevEco Studio\sdk\HarmonyOS-NEXT-DB1\openharmony\toolchains,
    D:\ProgrameFile\HuaWei\DevEco Studio:这个示例路劲是指你DevEco Studio的安装包的路径

在这里插入图片描述
在这里插入图片描述

执行flutter build hap xxx 报 java ENOENT

在这里插入图片描述
解决方案:
需要安装openjdk17的环境, 并设置好环境变量, 然后在次执行flutter build指令 即可,Jdk17的安装参考地址

flutter_flutter配置文档上的SDk的问题

在这里插入图片描述
这个问题是以前就版本才需要执行的,目前IDE一体化之后就不需要了(IDE 版本5.1.3.300及之后的版本都不在需要执行这个指令。)

Flutter鸿蒙化对JDK的版本要求

  1. 建议使用JDK的版本是 openjdk17的版本
  2. 经验证jdk22的版本是会报错
  3. 至于jdk17以上到22之间的版本, 华为技术回复:
    在这里插入图片描述
    注意:如果需要确切的知道有没有适配, 可能需要找对应的技术人确认

Mac上环境配置问题集

如何配置hdc的路径

  1. vim ~/.zshrc
  2. 增加如下export PATH=${PATH}:/Users/用户名/Library/Huawei/Sdk/openharmony/版本/toolchains
  3. source ~/.zshrc
  4. hdc version 查看版本如下就可以了

No Hmos SDK found. Try setting the HOS_SDK_HOME environment variable

当我们执行flutter doctor -v检车环境时,一切正常。

我们使用DevEco Studio编译项目时是正常的, 但是当我们使用Android Studio打开这个Flutter项目,并运行的时候报如下错误:

在这里插入图片描述
我们已经在环境变量配置文件中,配置了该环境变量。

解决方案:
这时候我们需要执行下flutter项目中的ohos的SDK

# 指向DevEco-Studio下的sdk目录
flutter config --ohos-sdk=/Applications/DevEco-Studio.app/Contents/sdk(mac电脑上DevEco Studio的sdk路径)

然后再次运行项目就正常了。

Flutter鸿蒙化问题集

flutter项目使用鸿蒙化的三方库,flutter build hap失败

在windows电脑上, 我们执行命令flutter pub get, 默认缓存第三方库的路径是在C:\Users\issuse\AppData\Local\Pub\Cache路径下, 但是我们在flutter项目中如果配置了鸿蒙化的flutter三方库, 例如:share_preferences, 这时候fluttre项目编译运行都是正常的, 但是当我们在鸿蒙项目中执行flutter build hap时,会报如下错误:
在这里插入图片描述
原因:首先我们使用鸿蒙化的flutter三方库,flutter pub get的三方库的缓存路径一定要和你的工程是处在同一个磁盘

我之所以报这个错误是,我的三方库的缓存路径在C盘, 但是我的项目在D盘。

解决方案:
首先我们需要把flutter pub get的三方库的缓存路径设置到和项目同一个磁盘中, 我这里是把路径设置到D盘了。

我们需要再系统环境变量中添加一个环境变量:

PUB_CACHE = D:\Pub\Cache

在这里插入图片描述
然后在重新执行flutter pub get

如果执行命令报如下错误:
在这里插入图片描述
那么我们需要打开鸿蒙工程把oh-package.json5和build-profile.json5 这两个文件 报错库的这一项直接删除, 然后在重新执行命令, 鸿蒙这边在重新执行flutter build hap 就可以了。

如何在已存在的Flutter项目中创建鸿蒙模块

cd到flutter工程目录下 使用命令 flutter create ./ --platform ohos 创建鸿蒙模块。

在flutter项目的跟目录下创建ohos的模块,报错is not a valid Dart package name

原因: 目录名不对, flutter的工程名只支持abc_abd123这种格式的名称, 不支持大写字母, 可以检查你的项目的名称是否符合flutter命名规范

参考地址: https://dart.dev/tools/pub/pubspec#name

解决方案: 直接修改目录名称到符合规范

如何替换鸿蒙已经适配的三方库 已share_preferences三方库为例

首先我们需要更新我们的pubspec.yaml文件:

在这里插入图片描述
注意:该三方库的地址可以从鸿蒙适配三方库列表中,找到地址, 然后根据相关地址文档来使用git依赖三方库的方式,依赖库

Flutter官方如何使用git地址来依赖package

鸿蒙适配三方库列表

如果你依赖的其三方库中也依赖的这个三方库, 并且和你主动依赖的库的版本不一致、库的来源也不一致, 这会导致两个问题, 一个是库的版本不一致的问题; 还有一个是库覆盖问题,导致我们最终使用的不是鸿蒙适配的三方库。

解决方案:
在这里插入图片描述

直接强制指定库的版本和来源。

参考链接:
https://docs.flutter.cn/packages-and-plugins/using-packages#dependencies-on-unpublished-packages

配置了pubspec.yaml文件无法拉取鸿蒙适配的三方库

首先我们可以尝试: flutter pub cache clean

然后删除掉pubspec.lock文件, 在重新flutter pub get

在这里插入图片描述

鸿蒙三方库适配列表中纯Dart库适配注意事项

  1. 纯Dart库,可以直接在flutter项目中使用,可以不必和华为提供列表中的版本一致, 但是该库的版本必需满足 Flutter SDK 3.7.12Dart 2.19.6支持的版本。
  2. 查看该库中的pubspec.yaml 文件, 是否有platforms关键字, 如果有就代表有平台侧的代码实现,需要做鸿蒙化适配后才可以在鸿蒙侧使用。

示例:
https://github.com/cfug/dio/blob/main/dio/pubspec.yaml
https://gitee.com/openharmony-sig/flutter_packages/blob/master/packages/webview_flutter/webview_flutter/pubspec.yaml

Flutter项目运行一直报错,报相关缓存错误

大概率是本地缓存或者AGP 和 Flutter 之间有什么不兼容的地方导致了,您这边建议先尝试清理下构建环境看看

  1. flutter clean;
  2. flutter pub get;
  3. flutter precache // 预下载。

Flutter工程运行在手机上一直卡在Running Gradle task ‘assembleDebug’…

可能是由于gradle没有下载成功, 一直在下载,导致卡在这里。

Gradle 是安卓的构建工具,必须要先下载对应版本才能使用。而我们遇到的问题经常是, android studio 里面下载很慢。可以使用下面的国内域名来下载gradle

https://mirrors.cloud.tencent.com/gradle/xxx(gradle-8.6-bin.zip)

Flutter项目运行正常, 突然报错类似缓存错误

  1. 原因应该大概率是本地缓存或者AGP 和 Flutter 之间有什么不兼容的地方导致了,您这边建议先尝试清理下构建环境看看
  2. flutter clean;
  3. flutter pub get;
  4. flutter precache

Flutter项目中如何判断鸿蒙平台

第一种判断不是android 和 ios 就是鸿蒙平台, 通过Platform 类判断
在这里插入图片描述
第二种通过Theme.of(context).platform == TargetPlatform.ohos 的方式来判断是否是ohos平台

在这里插入图片描述
目前也可以直接使用下面的方法来判断:

import 'package:flutter/foundation.dart';

bool isOhos() {
  return defaultTargetPlatform == TargetPlatform.ohos;
}

Flutter项目在鸿蒙手机上系统键盘完成按钮文字不显示问题

在这里插入图片描述
Flutter项目中使用TextfFiled这个widget, 设置了键盘属性现在textInputAction: TextInputAction.newline, 为换行, 导致完成按钮的文字不显示。

执行flutter build hap报错hvigorw assembleHap -p product=default -p buildMode=release --no-daemon

当我把鸿蒙的编译器从600升级到910之后, 在鸿蒙项目中执行flutter build hap编译, 报如下错误:
在这里插入图片描述
600的编译器编译是正常的,但是910就不行。

解决方案:
配置hvigor-confog.json 配置文件,内容如下:

/*
* Copyright (c) 2023 Hunan OpenValley Digital Industry Development Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

{ 
  "modelVersion": "5.0.0",
  "dependencies": {
  },
  "debugging": {
    "stacktrace": true
  },
  "properties": {
    "ohos.nativeResolver": false
  }
}

然后保存,清楚缓存,在次执行flutter build hap,即可编译成功

### 如何在鸿蒙OS上设置和配置Flutter开发环境 #### 下载并安装Flutter鸿蒙分支 为了能够在鸿蒙操作系统上使用Flutter进行应用开发,首先需要下载适用于鸿蒙系统的特定版本的Flutter SDK。对于Mac用户而言,在VSCode环境中可以通过访问官方文档或社区资源来找到最新的鸿蒙Flutter分支,并按照指引完成下载过程[^2]。 #### 安装依赖项与工具链 除了获取正确的SDK外,还需要确保本地机器已经安装了必要的依赖组件以及工具链。这通常涉及到Java Development Kit (JDK),Android SDK及其命令行工具等前置条件。此外,建议采用DevEco Studio作为IDE来进行鸿蒙应用程序的开发工作,因为它提供了针对该平台优的功能支持和服务[^4]。 #### 设置环境变量 无论是Windows还是macOS系统下,都需要正确地设定环境变量以便于后续操作顺利执行。具体来说就是将Flutter bin目录加入PATH中去,这样可以在任何地方调用`flutter`命令而无需提供完整路径。值得注意的是,尽管两个平台上具体的文件夹位置有所差异,但是基本的操作流程是一致的。 #### 测试环境有效性 当上述准备工作完成后,可以尝试运行简单的测试程序验证当前配置是否有效。打开终端窗口输入`flutter doctor`查看是否存在未解决的问题;如果一切正常,则继续利用`flutter create my_app`建立一个新的工程实例,并将其部署至连接好的鸿蒙设备之上以确认整个链条都能顺畅运作[^1]。 ```bash # 创建新项目 $ flutter create hello_harmony # 切换到项目根目录 $ cd hello_harmony # 查看可用设备列表 $ flutter devices # 构建并启动应用(假设已知deviceId) $ flutter run --debug -d <deviceId> ``` 通过以上步骤就可以初步建立起一套完整的基于鸿蒙OS的Flutter开发环境了。当然实际过程中可能还会遇到各种各样的挑战,这时候查阅相关资料或者向开发者社群寻求帮助都是非常有效的解决方案之一[^3]。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值