每日见闻之运行第一个flutter鸿蒙项目

1 下载项目 并切换到指定分支

git clone https://gitcode.com/openharmony-tpc/flutter_flutter.git
git checkout -b dev origin/dev

2 安装DevEco-Studio

3 安装虚拟机

4 配置环境变量～/.bash_profile

# 拉取下来的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

参照上面的配置环境

注意点1 node环境的冲突

export PATH=$TOOL_HOME/tools/node/bin:$PATH # command-line-tools/tool/node/bin

如果你安装了nvm 并且在环境变量里面设置了nvm 那么你执行source .bash_profile会报下面的错

nvm is not compatible with the npm config "prefix" option: currently set to

这是因为你配置的鸿蒙的node 跟 nvm管理的node 的prifix 不一致

可以npm config list 查看 nvm 管理的node的prefix

我是暂时取消了nvm的配置，有别的解决办法，评论区见。

注意点2

export PATH=/Users/admin/ohos/flutter_flutter/bin:$PATH

这个地方也配置了 flutter路径可能会跟你原来配置的flutter的路径会冲突。

5 执行命令创建项目

flutter create --platforms ohos <projectName>

6 用DevEco-Studio 打开ohos 文件夹 运行

6.1 可能你指定的支持的设备版本太高跟你的虚拟机对不上，在下面的图上面可以找到指定版本的位置以及怎么查看虚拟机的版本

6.2 运行可能会提示软件版本太低，修改到软件支持的版本

6.3 运行可能报错

/../third_party/skia/src/gpu/ShaderErrorHandler.cpp:22: fatal error: "Shader compilation failed!"

去掉flutter 页面的FloatButton