HarmonyOs应用《重要日》开发第2篇 - 开发环境搭建与项目创建

📅 2026/7/16 9:27:42
HarmonyOs应用《重要日》开发第2篇 - 开发环境搭建与项目创建
本篇将手把手教你如何搭建 HarmonyOS 开发环境创建 ImportantDays 项目工程并完成基础配置。一、开发工具准备1.1 DevEco StudioHarmonyOS 应用开发使用华为官方 IDEDevEco Studio它是基于 IntelliJ IDEA 社区版定制的集成开发环境。下载地址华为开发者官网 https://developer.huawei.com/consumer/cn/deveco-studio/系统要求Windows 10/11 64 位macOS 11 或更高版本内存8GB 以上推荐 16GB磁盘空间10GB 以上1.2 SDK 安装安装 DevEco Studio 后首次启动会引导安装 HarmonyOS SDK。本项目使用的是HarmonyOS SDK 版本5.0.3(15)ArkTS 版本对应 SDK 5.0.3在 DevEco Studio 中通过File Settings SDK确认 SDK 版本。1.3 模拟器配置为了测试应用需要配置 HarmonyOS 模拟器打开 DevEco Studio点击Tools Device Manager创建一个新的模拟器Phone 类型选择合适的系统镜像也可以使用真机调试需要在开发者选项中开启 USB 调试。二、创建项目2.1 新建工程打开 DevEco Studio点击Create Project选择Empty Ability模板填写项目信息Project nameImportantDaysBundle namecom.importantdays.appSave location选择你的工作目录Compile SDK5.0.3(15)Compatible SDK5.0.3(15)Module languageArkTSDevice typePhone点击Finish创建工程2.2 项目初始结构创建完成后DevEco Studio 会自动生成以下文件结构ImportantDays/ ├── AppScope/ │ ├── app.json5 # 应用配置 │ └── resources/ │ └── base/ │ └── element/ │ └── string.json # 应用名称等字符串 ├── entry/ │ └── src/main/ │ ├── ets/ │ │ ├── entryability/ │ │ │ └── EntryAbility.ets # 入口 Ability │ │ └── pages/ │ │ └── Index.ets # 默认首页 │ ├── resources/ │ │ └── base/ │ │ ├── element/ │ │ │ ├── color.json │ │ │ ├── float.json │ │ │ └── string.json │ │ └── media/ # 图标资源 │ └── module.json5 # 模块配置 ├── build-profile.json5 ├── oh-package.json5 └── hvigorfile.ts2.3 修改应用配置打开AppScope/app.json5修改为{ app: { bundleName: com.importantdays.app, vendor: example, versionCode: 1000000, versionName: 1.0.0, icon: $media:layered_image, label: $string:app_name } }打开AppScope/resources/base/element/string.json添加应用名称{ string: [ { name: app_name, value: 重要日 } ] }三、引入第三方依赖3.1 添加 dayjs本项目使用 dayjs 进行日期处理。打开oh-package.json5{ modelVersion: 5.0.3, description: ImportantDays - Track your important days with countdown/count-up, dependencies: { dayjs: ^1.11.13 }, devDependencies: { ohos/hypium: 1.0.21 } }3.2 同步依赖在 DevEco Studio 中修改oh-package.json5后会自动提示同步。也可以手动触发点击工具栏的Sync Now按钮或者执行File Sync and Refresh Project等待 hvigor 构建工具自动下载 dayjs 到oh_modules/目录。3.3 验证依赖安装同步完成后项目目录下会出现oh_modules/dayjs/文件夹确认安装成功。四、创建项目目录结构按照 MVVM 架构我们需要创建以下目录entry/src/main/ets/ ├── common/ # 常量 ├── components/ # UI组件 ├── model/ # 数据模型 ├── types/ # 类型定义 ├── utils/ # 工具类 └── viewmodel/ # ViewModel在 DevEco Studio 中右键ets目录选择New Directory依次创建上述目录。五、配置 module.json5module.json5是模块的核心配置文件本项目配置如下{ module: { name: entry, type: entry, description: $string:module_desc, mainElement: EntryAbility, deviceTypes: [phone], deliveryWithInstall: true, installationFree: false, pages: $profile:main_pages, abilities: [ { name: EntryAbility, srcEntry: ./ets/entryability/EntryAbility.ets, description: $string:EntryAbility_desc, icon: $media:layered_image, label: $string:EntryAbility_label, startWindowIcon: $media:foreground, startWindowBackground: $color:start_window_background, exported: true, skills: [ { entities: [entity.system.home], actions: [action.system.home] } ] } ], extensionAbilities: [ { name: EntryBackupAbility, srcEntry: ./ets/entrybackupability/EntryBackupAbility.ets, type: backup, exported: false, metadata: [ { name: ohos.extension.backup, resource: $profile:backup_config } ] } ] } }关键配置说明mainElement指定应用的入口 Ability 为EntryAbilitypages引用main_pagesprofile 文件定义页面路由skills声明应用可以响应系统桌面点击启动extensionAbilities配置备份 Ability六、配置页面路由在entry/src/main/resources/base/profile/目录下创建main_pages.json{src:[pages/MainEntry,pages/AddEditDayPage,pages/DayDetailPage]}这里注册了三个页面MainEntry主入口页面包含 Tab 导航AddEditDayPage添加/编辑页面使用 router 跳转DayDetailPage详情页面使用 router 跳转七、构建验证完成以上配置后点击 DevEco Studio 工具栏的Build Build H(s)进行编译。如果编译成功说明项目框架搭建完成。常见编译问题SDK 版本不匹配检查build-profile.json5中的 SDK 版本依赖同步失败检查网络连接重新同步 oh-package.json5页面路由找不到确保main_pages.json中注册了所有页面八、小结本篇详细介绍了 HarmonyOS 开发环境的搭建过程包括 DevEco Studio 安装、项目创建、依赖管理、目录结构规划和核心配置文件。完成这些步骤后项目的基本框架就已经搭建好了。