鸿蒙NEXT+Flutter开发3-电脑环境配置

最新推荐文章于 2025-04-08 11:51:00 发布

佛山芃程科技

最新推荐文章于 2025-04-08 11:51:00 发布

阅读量156

点赞数

文章标签： harmonyos flutter 华为

原文链接：https://blog.51cto.com/u_17078474/12319401

版权

在macos电脑上配置鸿蒙 NEXT + Flutter 开发环境主要包括安装 DevEco Studio、下载 Flutter SDK、配置环境变量、安装VS Code等几大步骤：

1.下载并安装 DevEco Studio

打开华为下载中心，网址为：https://developer.huawei.com/consumer/cn/download/，下载对应的Mac（ARM）版本。
运行安装程序，按照安装向导的提示完成 DevEco Studio 的安装。
安装完成后，打开 DevEco Studio，它会自动进行一些初始化配置。

2.下载 Flutter SDK

目前谷歌并没有官方宣布 Flutter 对鸿蒙 NEXT 的支持。想要在鸿蒙NEXT系统上使用Flutter进行开发，需要使用社区定制版的Flutter，网址为：https://gitee.com/openharmony-sig/flutter_flutter

终端使用命令mkdir work & cd work，创建并进入目录，flutter SDK将下载在该目录中。
通过代码工具下载当前仓库代码git clone https://gitee.com/openharmony-sig/flutter_flutter.git，可指定dev或master分支，一般使用master分支即可。

3.配置环境变量

打开终端，输入env，查找得到SHELL=/bin/zsh，笔者使用的shell是zsh
输入命令：nano ~/.zshrc ，修改对应配置信息，添加下面的数据

# mac环境
        export TOOL_HOME=/Applications/DevEco-Studio.app/Contents # 
        export DEVECO_SDK_HOME=$TOOL_HOME/sdk # command-line-tools/sdk
        export PATH=$DEVECO_SDK_HOME/default/openharmony/toolchains:$PATH # hdc
        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
        # 鸿蒙flutter端
        export PATH=/Users/******/work/flutter_flutter/bin:$PATH
        export PUB_HOSTED_URL=https://pub.flutter-io.cn
        export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
        export FLUTTER_GIT_URL=https://gitee.com/openharmony-sig/flutter_flutter.git
        export PATH="$PATH":"$HOME/.pub-cache/bin"
        # git代理，根据需要确定是否配置
        git config --global http.proxy socks5://127.0.0.1:1234
        git config --global https.proxy socks5://127.0.0.1:1234
        # 终端代理，根据需要确定是否配置
        export http_proxy="http://127.0.0.1:1234"
        export https_proxy="http://127.0.0.1:1234"

4.检测设置是否正常

运行 flutter doctor -v 检查环境变量配置是否正确
显示如下图所示，均为☑️，表示环境变量配置正确
如果存在✖️项，仔细对照上面步骤进行配置，直至全部☑️为止

5.安装VS Code

VS Code作为一款功能强大的代码编辑器，支持多种编程语言，并提供了丰富的插件生态系统，可以满足你的各种开发需求。故笔者使用VS Code进行Flutter代码的开发调试，其安装步骤如下。读者也可以选择自己熟悉的代码编辑器。

打开浏览器，访问 Visual Studio Code 官方网站：https://code.visualstudio.com/。
在官网首页，你会看到 “Download for Mac” 按钮，点击它开始下载安装程序。
下载完成后，双击安装文件，将 VS Code 图标拖动到 “Applications” 文件夹中，完成安装。

完成上面的步骤之后，电脑端的配置工作基本完成。

至此，使用Flutter进行鸿蒙NEXT开发的软硬件环境已经全部备齐，其中主要包括硬件部分（Mate60Pro手机+MacBook Pro电脑）、软件部分（DevEco Studio+Flutter SDK+VS Code）。