Flutter鸿蒙化环境配置（windows）
Flutter鸿蒙化环境配置（windows）
文章目录
- Flutter鸿蒙化环境配置（windows）
- 环境搭建
- 一、下载Flutter SDK，配置环境变量
- 1.1下载鸿蒙版Flutter
- 1.2配置环境变量
- 1.2.1 编辑器自带工具配置环境变量
- 1.2.2 配置鸿蒙版flutter环境
- 1.2.3 配置JDK
- 1.2.4 其他环境变量
- 1.2.5 验证结果
- 二、创建Flutter项目，运行鸿蒙模拟器
- 2.1 创建flutter项目
- 2.1.1命令行创建flutter项目
- 2.1.2 打开鸿蒙部分
- 2.2 在鸿蒙模拟器上实现flutter demo
- 总结
环境搭建
一、下载Flutter SDK，配置环境变量
1.1下载鸿蒙版Flutter
鸿蒙 Flutter SDK 需要在 GitCode 下载。
通过代码工具包下载当前仓库代码git clone https://gitcode.com/openharmony-tpc/flutter_flutter.git， 并切换到dev分支，本人用的3.22版本，区别不大
下载完后使用git branch查看当前版本，默认应该是3.7
使用 git checkout [版本号] 命令，完成版本切换
1.2配置环境变量
需要配置以下用户变量
注意鸿蒙开发需要安装Java和配置相关变量
1.2.1 编辑器自带工具配置环境变量
配置环境变量
编辑 PATH，添加以下路径，鸿蒙开发需要配置ohpm，hvigor，node以及hdc的环境变量，node,ohpm,hvigor这三个在编辑器DevEco Studio的安装目录里的tools文件内，而hdc则是在 XXXDevEco Studiosdkdefaultopenharmony oolchains 目录下。
此四项配置环境变量如下图
C:Program FilesHuaweiDevEco Studiotoolshvigorbin
C:Program FilesHuaweiDevEco Studiotoolsohpmbin
C:Program FilesHuaweiDevEco Studiotoolsnode
C:Program FilesHuaweiDevEco Studiosdkdefaultopenharmonytoolchains
同时我们还需要在用户环境变量中增加 HOS_SDK_HOME 也就是harmonyos的SDK的路径
地址换成你安装编辑器的sdk路径
HOS_SDK_HOME
C:Program FilesHuaweiDevEco Studiosdk
1.2.2 配置鸿蒙版flutter环境
注意：如果你之前有下载官方版本的FlutterSDK，那么这里配置的flutter_flutter的环境变量一定要在你自己下载的鸿蒙版flutterSDK的环境变量之前（flutter_windows_3.7.12-stable lutterin）， 如果鸿蒙版在path的位置在官方的顺序之下， 你在使用flutter doctor –v检测环境时， 无法出现 HarmonyOS 的环境标志
除此之外还需要配置一下国内的镜像源以防万一
PUB_HOSTED_URL
https://pub.flutter-io.cn
FLUTTER_STORAGE_BASE_URL
https://storage.flutter-io.cn
配置如下图：
FLUTTER_STORAGE_BASE_URL
PUB_HOSTED_URL
1.2.3 配置JDK
官网地址在这，现在好像需要注册账号了，邮箱注册就行
安装时记得记下安装路径，安装完成了配置环境变量
以防万一path里面也加上
1.2.4 其他环境变量
有些情况下打包的时候会报错，提示缺少DEVECO_SDK_HOME的环境，所以得加上
这个就是DevEco编辑器的sdk位置
DEVECO_SDK_HOME
C:Program FilesHuaweiDevEco Studiosdk
此外还有下载flutter的git地址，因为鸿蒙版flutter迁移到华为自己的GitCode里面去了，原先的Gitee好像没更新了
本人这里是从GitCode克隆的，所以填的这个链接，看你们从哪克隆就填什么地址链接
FLUTTER_GIT_URL
https://gitcode.com/openharmony-tpc/flutter_flutter.git
除了这些还有hdc跟flutter以防万一也在外面配置下，最好是配置，不然可能会有很多奇奇怪怪的坑
HDC_HOME
C:Program FilesHuaweiDevEco Studiosdkdefaulthmstoolchains
HOST_FLUTTER
C:UsersThinkPadharmony_flutterflutter_flutterbin
以下是我的配置情况：
1.2.5 验证结果
SDK 下载完成，环境变量配置妥当后，使用 flutter doctor -v 检查各项是否通过。
在命令行中，运行 ohpm -v, hvigorw -v, node -v 查看是否能使用，确保各个依赖的工具，其 PATH 配置正确。
使用 echo %DEVECO_SDK_HOME%, echo %JAVA_HOME% 等检查用户变量是否生效。
环境变量发生变化时，需要重启命令行工具。
只要保证前两个能用就行，本人用的是3.22.1版本，不影响使用
另外，需要注意的是，优先添加用户环境变量，如果是系统环境变量，可能需要注销登录或者重启系统，否则配置可能不生效。
二、创建Flutter项目，运行鸿蒙模拟器
2.1 创建flutter项目
2.1.1命令行创建flutter项目
新建一个存放项目的文件夹，右击打开命令行
命令如下：
flutter create my_app01
执行结果：
创建完成后把创建的项目用VsCode打开
2.1.2 打开鸿蒙部分
vscode打开后，用DevEco Studio打开my_app03里面的ohos文件
等DevEco初始化完成，有报错不用管，先登录华为账号，启动模拟器
模拟器版本无所谓，高一点也好
启动后配置自动签名，API版本暂时不用管，
当签名完成后，回到vscode，发现自动检测到了鸿蒙模拟器
点击显示所有设备
第一个就是我们的鸿蒙模拟器
2.2 在鸿蒙模拟器上实现flutter demo
打开VsCode的命令行
输入打包命令（新版本flutter不需要携带过多参数）
flutter build hap --debug
执行打包命令效果如下图所示：
打包完成后开始运行flutter项目
在终端继续输入命令：
flutter run
运行结果以及模拟器效果如下放图片依次展示：
运行效果：
模拟器效果：
总结
不得不说，真的很多坑，本人配置的时候，最开始下载的官方版本flutter，把安卓模拟器跑起来了，后面跑鸿蒙的时候，vscode怎么都获取不到鸿蒙的模拟器，打包也打不了。争取一步到位，一般来说签名完成后，vscode就自动能获取到鸿蒙模拟器。
不用太在意flutter doctor -v的其他报错，特别是VsStudio跟安卓的，假如你是初学者并且没干过安卓的话，想研究flutter鸿蒙，就暂时别碰安卓的配置。
以上就是今天要讲的内容，喜欢的话可以收藏，也可以问我。
