鸿蒙Flutter实战:01-搭建开发环境

田楷
• 阅读 8

准备工作

1.安装 DevEco Studio NEXT IDE, 注意版本应该是 Next,当前最新的是 Beta3

2.安装Git, 如果要同时适配安卓,需要安装Android Studio; 如果要适配ios,需要安装Xcode

Mac 安装(推荐)

环境变量配置

# Flutter Mirror
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

# HarmonyOS SDK
export TOOL_HOME=/Applications/DevEco-Studio.app/Contents/
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

Windows 安装

配置用户变量

FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

PUB_HOSTED_URL=https://pub.flutter-io.cn

DEVECO_SDK_HOME=C:\Program Files\Huawei\DevEco Studio\sdk

JAVA_HOME=C:\Program Files\Huawei\DevEco Studio\jbr

配置环境变量

编辑 PATH,添加以下路径

C:\Program Files\Huawei\DevEco Studio\tools\ohpm\bin

C:\Program Files\Huawei\DevEco Studio\tools\hvigor\bin

C:\Program Files\Huawei\DevEco Studio\tools\node

管理多个 Flutter 版本

如果在项目开发中,需要使用多个 Flutter 版本,可以考虑使用 fvm

  1. 安装 FVM
  2. 使用 fvm 官方 flutter 版本
fvm install 3.22.0
  1. 安装自定义鸿蒙版本,进入 fvm/version 目录,通常位于用户目录下,如 ~/fvm/versions/3.22.0, 拷贝仓库并重命名为 custom_x.y.z的名字
git clone -b dev https://gitee.com/openharmony-sig/flutter_flutter.git custom_3.7.12
  1. 在项目中使用单独的 flutter sdk 版本, 在项目目录中执行:
fvm use custom_3.7.12

常见问题

  1. 运行 flutter doctor 出现 Error: Unable to find git in your PATH.

执行以下命令

git config --global --add safe.directory '*'

案例

Flutter 鸿蒙交流群

【flutter鸿蒙技术交流群】

目前 Flutter 鸿蒙已经跑通,但仍然存在一些潜在的坑需要解决和处理,欢迎大家一起分享交流

请扫码加小助手进群: 备注:鸿蒙Flutter wx:zacksleo

鸿蒙Flutter实战:01-搭建开发环境

参考资料

点赞
收藏
评论区
推荐文章
田楷 田楷
9小时前
鸿蒙Flutter实战:02-Windows环境搭建踩坑指南
鸿蒙Flutter实战:02Windows环境搭建踩坑指南环境搭建1.下载FlutterSDK,配置环境变量鸿蒙FlutterSDK需要在。目前建议下载dev分支代码。需要配置以下用户变量注意鸿蒙开发需要安装Java和配置相关变量bashfluttersd
田楷 田楷
9小时前
鸿蒙Flutter实战:04-如何使用DevTools调试Webview
鸿蒙Flutter如何使用DevTools调试Webview在《鸿蒙Flutter开发中集成Webview》,介绍了如果在Flutter中集成Webview.本文则为Webview的调试方法。配置WebviewCustomView.ets文件中,在生命周期
田楷 田楷
9小时前
鸿蒙Flutter实战:06-使用ArkTs开发Flutter鸿蒙插件
使用ArkTs开发Flutter鸿蒙平台插件本文讲述如何开发一个Flutter鸿蒙插件,如何实现Flutter与鸿蒙的混合开发,以及双端消息通信。Flutter侧,编写MethodChanneldartconstMethodChannelmethodCha
田楷 田楷
9小时前
鸿蒙Flutter实战:07-混合开发
鸿蒙Flutter实战:混合开发鸿蒙Flutter混合开发主要有两种形式。1.基于har将fluttermodule打包成har包,在原生鸿蒙项目中,以har包的方式引入。其优点是主项目开发者可以不关注Flutter实现,不需要安装配置Flutter开发环
田楷 田楷
9小时前
鸿蒙Flutter实战:08-如何调试代码
鸿蒙Flutter实战:如何调试代码1.环境搭建参考文章搭建好开发环境。IDE安装好DevEco和VsCode/AndroidStudio。2.配置如果是vscode,可以在.vscode/launch.json文件中,增加以下配置json"name":"
田楷 田楷
9小时前
鸿蒙Flutter实战:09-现有Flutter项目支持鸿蒙
鸿蒙Flutter实战:现有Flutter项目支持鸿蒙背景原来使用Flutter开发的项目,需要适配鸿蒙。环境搭建见文章[鸿蒙Flutter适配指南],搭建开发环境,使用fvm管理多版本SDK。模块化原有项目保持模块化,拆分为apps/common/com
田楷 田楷
9小时前
鸿蒙Flutter实战:10-常见问题集合
鸿蒙Flutter实战:10常见问题集合1.学习路径应该是怎样的,需要掌握哪些技术才具备鸿蒙Flutter开发能力1.1学习和掌握Flutter开发技术,这块需要在Flutter社区学历1.2学习鸿蒙基础概念和知识,推荐学习,,,2.MatePad应用适配
田楷 田楷
9小时前
鸿蒙Flutter实战:12-使用模拟器开发调试
鸿蒙Flutter实战:使用模拟器开发调试前提开发电脑需为M系列芯片(ARM架构)的Mac电脑目前Flutter鸿蒙开发,无法使用X86架构的模拟器,只能使用ARM架构的模拟器创建项目等开发环境搭建成功,使用fluttercreate命令创建项目新项目ba
田楷 田楷
9小时前
鸿蒙Taro实战:01-搭建开发环境
鸿蒙Taro实战:01搭建开发环境配置鸿蒙环境下载安装DevEco配置IDE打开Prefreences,OpenHarmonySDK,勾选APIVersion12创建鸿蒙项目打开DevEco,点击右上角CreateProject,在Application处