一、开发环境准备1. DevEco Studio 下载与安装DevEco Studio 是华为官方提供的鸿蒙应用开发 IDE基于 IntelliJ IDEA 定制集成了鸿蒙应用开发所需的全部工具。系统要求操作系统Windows 10/11 (64位)、macOS 10.14 及以上、LinuxUbuntu 18.04 及以上内存建议 8GB 及以上硬盘空间至少 10GB 可用空间屏幕分辨率1280 x 800 及以上下载步骤访问华为开发者联盟官网打开浏览器访问华为开发者联盟-HarmonyOS开发者官网共建鸿蒙生态点击开发 → “DevEco Studio”下载 DevEco Studio选择对应的操作系统版本下载最新版本的 DevEco Studio本文以 DevEco Studio 4.0 为例安装 DevEco StudioWindows 系统双击下载的.exe安装文件按照安装向导提示进行安装建议选择为所有用户安装选项记住安装路径默认C:\Program Files\Huawei\DevEco StudiomacOS 系统打开下载的.dmg文件将 DevEco Studio 拖到应用程序文件夹首次打开可能需要在系统偏好设置 → 安全性与隐私中允许打开Linux 系统解压下载的.tar.gz文件打开终端进入解压目录运行./bin/devecostudio.sh启动安装向导安装注意事项安装过程中会提示安装 SDK建议勾选安装 HarmonyOS SDK确保安装路径不包含中文或特殊字符建议创建桌面快捷方式方便后续使用二、配置开发环境1. HarmonyOS SDK 配置SDKSoftware Development Kit是开发鸿蒙应用所需的软件开发工具包。首次启动配置启动 DevEco Studio首次启动会显示欢迎使用 DevEco Studio界面选择Do not import settings → 点击OK接受许可协议阅读并接受许可协议点击Next继续选择安装类型Standard标准自动安装推荐的 SDK 组件推荐新手Custom自定义手动选择需要安装的 SDK 组件建议选择Standard选择 SDK 安装路径默认路径WindowsC:\Users\用户名\AppData\Local\Huawei\SdkmacOS~/Library/Huawei/SdkLinux~/Huawei/Sdk可以点击Browse自定义路径路径不能包含中文下载 SDK 组件点击Next开始下载必要的 SDK 组件等待下载完成时间取决于网络速度点击Finish完成配置手动配置 SDK如果首次启动未成功配置 SDK可以手动配置打开 SDK Manager菜单栏File → SettingsWindows/Linux或 DevEco Studio → PreferencesmacOS导航到Appearance Behavior → System Settings → HarmonyOS SDK配置 SDK 路径在HarmonyOS SDK Location中设置 SDK 路径点击Apply应用设置安装 SDK 平台切换到SDK Platforms选项卡勾选需要开发的 HarmonyOS 版本如 HarmonyOS 4.0点击Apply开始安装安装 SDK 工具切换到SDK Tools选项卡勾选以下工具HarmonyOS SDK Build-ToolsHarmonyOS SDK Platform-ToolsEmulator模拟器可选点击Apply开始安装2. Node.js 配置DevEco Studio 需要 Node.js 运行环境来支持某些功能。检查 Node.js 是否已安装打开终端/命令提示符输入bash复制node --version npm --version如果显示版本号说明已安装否则需要安装。安装 Node.js下载 Node.js访问Node.js — Run JavaScript Everywhere下载 LTS长期支持版本推荐 Node.js 16.x 或更高版本安装 Node.js按照安装向导进行安装确保勾选Add to PATH选项配置 npm 镜像可选加速下载bash复制npm config set registry https://registry.npmmirror.com在 DevEco Studio 中配置 Node.js打开 Settings/Preferences导航到Languages Frameworks → Node.js and npm设置 Node.js 解释器路径点击Apply应用设置3. 环境变量配置可选虽然 DevEco Studio 会自动配置大部分环境变量但手动配置可以方便命令行使用。Windows 系统右键此电脑 → “属性” → “高级系统设置”点击环境变量在系统变量中新建变量HARMONYOS_SDK_HOME值为 SDK 路径编辑Path变量添加%HARMONYOS_SDK_HOME%\toolchainsmacOS/Linux 系统编辑~/.bashrc或~/.zshrc文件添加bash复制export HARMONYOS_SDK_HOME~/Library/Huawei/Sdk # macOS export HARMONYOS_SDK_HOME~/Huawei/Sdk # Linux export PATH$HARMONYOS_SDK_HOME/toolchains:$PATH然后执行source ~/.bashrc或source ~/.zshrc使配置生效。三、模拟器配置模拟器是开发过程中测试应用的重要工具可以在没有真实设备的情况下运行和调试应用。1. 安装模拟器组件方法一通过 SDK Manager 安装打开 SDK ManagerFile → Settings → HarmonyOS SDK切换到SDK Tools选项卡勾选Emulator点击Apply开始安装方法二通过 AVD Manager 安装菜单栏Tools → Device Manager如果模拟器未安装会提示安装按照提示完成安装2. 创建模拟器步骤详解打开 Device Manager菜单栏Tools → Device Manager或者点击工具栏上的Device Manager图标创建新模拟器点击 Create Device按钮进入Select Hardware界面选择硬件配置设备类型Phone手机Tablet平板TV智慧屏Wearable穿戴设备设备型号选择具体的设备型号如 Huawei Mate 60 Pro点击Next选择系统镜像HarmonyOS 版本选择需要测试的 HarmonyOS 版本如 HarmonyOS 4.0ABI选择 CPU 架构arm64-v8a 或 x86_64arm64-v8a模拟 ARM 架构更接近真实设备x86_64模拟 x86 架构运行速度更快推荐如果镜像未下载点击Download下载下载完成后选择该镜像点击Next配置模拟器设置模拟器名称自定义名称如 “HarmonyOS_Phone_x86”启动方向Portrait竖屏或 Landscape横屏内存分配RAM建议 2GB 及以上VM Heap建议 256MB存储空间Internal Storage内部存储建议 4GB 及以上SD CardSD 卡存储可选其他设置勾选Use Host GPU使用主机 GPU 加速推荐勾选Enable Keyboard Input启用键盘输入点击Finish完成创建模拟器配置示例创建一个 x86_64 架构的手机模拟器名称HarmonyOS_Phone_x86设备类型Phone设备型号Huawei Mate 60 Pro系统版本HarmonyOS 4.0ABIx86_64RAM2048 MBVM Heap256 MBInternal Storage4096 MBUse Host GPU勾选3. 启动和关闭模拟器启动模拟器方法一通过 Device Manager 启动打开 Device Manager在模拟器列表中点击模拟器名称右侧的启动按钮三角形图标等待模拟器启动首次启动可能需要几分钟方法二通过工具栏启动在 DevEco Studio 工具栏中找到设备选择下拉菜单选择已创建的模拟器点击Run按钮模拟器会自动启动并运行应用方法三通过命令行启动bash复制# 进入 SDK 的 emulator 目录 cd $HARMONYOS_SDK_HOME/emulator # 列出所有模拟器 ./emulator -list-avds # 启动指定模拟器 ./emulator -avd HarmonyOS_Phone_x86模拟器界面介绍模拟器启动后你会看到屏幕区域显示鸿蒙系统界面工具栏右侧或底部包含以下按钮旋转切换横屏/竖屏返回返回上一级主页返回主屏幕最近任务查看最近使用的应用音量调节音量截图截取当前屏幕关闭关闭模拟器关闭模拟器方法一点击模拟器界面的关闭按钮方法二在 Device Manager 中点击停止按钮方法三命令行中按 CtrlC 终止进程4. 模拟器常见问题与解决方案问题1模拟器启动失败可能原因内存不足BIOS 未开启虚拟化技术SDK 路径包含中文解决方案检查系统内存是否充足建议关闭其他占用内存的应用进入 BIOS 开启虚拟化技术Intel VT-x 或 AMD-V确保 SDK 路径不包含中文或特殊字符问题2模拟器运行卡顿解决方案使用 x86_64 架构的模拟器比 arm64-v8a 更快勾选Use Host GPU使用主机 GPU 加速增加模拟器 RAM 分配建议 4GB关闭模拟器不必要的动画效果问题3模拟器无法连接网络解决方案检查主机网络连接是否正常在模拟器设置中确保Wi-Fi已开启重启模拟器四、创建第一个项目1. 新建项目步骤详解启动 DevEco Studio如果是首次启动会显示欢迎界面如果已打开项目选择 File → New → New Project选择项目模板在New Project界面选择Application选择Empty Ability空模板适合初学者点击Next配置项目信息Project Name项目名称如 “MyFirstApp”Bundle Name包名如 “com.example.myfirstapp”命名规则反向域名格式唯一标识应用Save Location项目保存路径确保路径不包含中文Compile SDK编译 SDK 版本选择已安装的版本如 4.0.0.0Model选择应用模型Stage 模型推荐HarmonyOS NEXT 主推FA 模型旧模型逐步废弃Enable Multi-Device是否支持多设备勾选后支持跨设备开发点击Next配置 AbilityAbility NameAbility 名称默认 “EntryAbility”Page Name页面名称默认 “Index”Device Type支持的设备类型Phone手机Tablet平板TV智慧屏Wearable穿戴设备勾选Phone即可点击Finish项目配置示例Project NameMyFirstAppBundle Namecom.example.myfirstappSave LocationD:\HarmonyOSProjects\MyFirstAppCompile SDK4.0.0.0ModelStageAbility NameEntryAbilityPage NameIndexDevice TypePhone2. 项目结构解析创建完成后DevEco Studio 会自动生成项目结构。理解项目结构对于后续开发非常重要。code复制MyFirstApp/ ├── .idea/ # IDE 配置文件 ├── entry/ # 主模块应用入口 │ ├── src/ │ │ ├── main/ │ │ │ ├── ets/ # ArkTS 代码目录 │ │ │ │ ├── entryability/ │ │ │ │ │ └── EntryAbility.ts # Ability 入口文件 │ │ │ │ └── pages/ │ │ │ │ └── Index.ets # 首页 │ │ │ ├── resources/ # 资源目录 │ │ │ │ ├── base/ │ │ │ │ │ ├── element/ # 颜色、字符串等资源 │ │ │ │ │ ├── media/ # 图片、音频等媒体资源 │ │ │ │ │ └── profile/ # 布局、样式等资源 │ │ │ │ └── rawfile/ # 原始文件不会被编译 │ │ │ └── module.json5 # 模块配置文件 │ │ └── ohosTest/ # 测试代码 │ ├── build-profile.json5 # 构建配置 │ └── hvigorfile.ts # 构建脚本 ├── AppScope/ │ └── app.json5 # 应用全局配置 ├── build-profile.json5 # 项目构建配置 ├── hvigorfile.ts # 项目构建脚本 └── local.properties # 本地配置文件核心文件详解AppScope/app.json5应用全局配置json复制{ app: { bundleName: com.example.myfirstapp, vendor: example, versionCode: 1000000, versionName: 1.0.0, icon: $media:app_icon, label: $string:app_name } }bundleName应用包名versionCode版本号整数用于版本判断versionName版本名称字符串用于展示icon应用图标label应用名称entry/src/main/module.json5模块配置json复制{ module: { name: entry, type: entry, description: module description, mainElement: EntryAbility, deviceTypes: [phone], abilities: [ { name: EntryAbility, srcEntry: ./ets/entryability/EntryAbility.ts, description: $string:EntryAbility_desc, icon: $media:icon, label: $string:EntryAbility_label, startWindowIcon: $media:icon, startWindowBackground: $color:start_window_background, visible: true, launchType: singleton, skills: [ { entities: [entity.system.home], actions: [ohos.want.action.home] } ] } ] } }abilities定义应用的 Ability界面和能力skills定义 Ability 可以响应的意图如启动器图标点击entry/src/main/ets/entryability/EntryAbility.tsAbility 入口typescript复制import UIAbility from ohos.app.ability.UIAbility; import window from ohos.window; export default class EntryAbility extends UIAbility { onWindowStageCreate(windowStage: window.WindowStage) { // 设置主页面 windowStage.loadContent(pages/Index, (err, data) { if (err.code) { console.error(Failed to load the content. Cause: JSON.stringify(err)); return; } }); } }onWindowStageCreate窗口创建时的回调loadContent加载页面内容entry/src/main/ets/pages/Index.ets首页typescript复制Entry Component struct Index { State message: string Hello World; build() { Row() { Column() { Text(this.message) .fontSize(50) .fontWeight(FontWeight.Bold) } .width(100%) } .height(100%) } }Entry页面入口装饰器Component组件装饰器State状态装饰器状态改变时 UI 自动更新