HarmonyOS组件化项目搭建

简介: 本文详细讲解了HarmonyOS组件化项目搭建的全过程,帮助开发者实现一个组件化项目。首先介绍了项目创建的基本步骤,包括使用DevEco Studio创建工程和EmptyAbility模块。接着说明了公共库(Common组件)的创建与使用,通过添加静态库并配置依赖关系实现模块化管理。随后阐述了功能模块(如Login模块)的创建流程,采用共享库形式并完成依赖配置。最后重点介绍了模块间路由跳转的实现方法,利用HarmonyOS的router机制完成页面跳转,并通过定义全路径和ConstantRouter类实现跨模块调用。随着鸿蒙生态发展,学习相关技术将成为趋势。

前言

鸿蒙应用开发已经成为互联网新的风口,开发鸿蒙软件已经成为今年工作的核心目标。在软件开发过程中,对于复杂度较大,功能较多的软件都会采用组件化项目架构,那么对于鸿蒙应用开发是否也能实现组件化呢?本文将详细讲解HarmonyOs组件化项目搭建的全过程,带领大家实现一个组件化项目。

项目创建

  1. 首先创建一个项目工程,点击开发工具DevEco-Stdio的File选项,选择New然后点击Create Project

  1. 选择创建一个EmptyAbility,然后直接下一步,创建工程。

  1. 工程主要包括一个entry模块,可以理解为Android的app主模块。  

公共库创建及使用

创建公共库Common组件。

  1. 在工程目录中,单机鼠标右键,选择New选项,然后在弹出的页面中选择Module。

  1. 在弹出的页面中,选择创建一个静态库Static Library。

  1. 然后点击Next,修改静态库的名称为common。

  1. 点击完成后,编译器会自动在项目的根目录的build-profile.json5文件中添加common模块。

  1. 添加项目依赖,common作为公共库,需要提供给其他模块使用,这里以entry为例,添加模块依赖,如下图所示。

  1. 至此,一个公共库common就创建完成了。

功能模块创建使用

一个功能复杂庞大的app不仅有公共模块,还有许多子模块构建而成。创建流程如下:

  1. 在工程目录中,单机鼠标右键,选择New选项,然后在弹出的页面中选择Module。

  1. 在弹出的页面中,选择创建一个共享库Shared Library。

  1. 然后点击Next,修改静态库的名称为login。
  2. 点击完成后,编译器会自动在项目的根目录的build-profile.json5文件中添加login模块。

  1. 添加项目依赖,login作为子模块,需要被entry依赖调用,添加模块依赖,如下图所示。

  1. 到目前为止子模块也创建完成。

模块路由跳转

前面创建分别创建了公共库和子模块,如何从主模块entry跳转到子模块login,或者子模块之间互相跳转呢?

  1. HarmonyOs在页面跳转时提供了router实现路由跳转。需要跳转的目标页面必须满足两个条件,@Entry修饰struct 和路由注册。被@Entry修饰的struct才是一个独立页面。同时需要在main_pages.json中注册路由。

  1. 在common中定义完整路径。不同子模块都会依赖公共静态库common。然后在common中定义目标页面的全路径。

全路径主要由三部分组成。分别是@bundle: 代表模版。 然后是 包名 com.cms.mvvm。最后是模块名+目标页面的全路径。

  1. 导出 ConstantRouter类,提供给其他模块调用。

  1. 引入ConstantRouter类,调用类中定义的路由。

总结

HarmonyOs组件化的使用,有利于模块之间的解耦及大型项目的共同开发。随着鸿蒙生态的不断完善,学习鸿蒙开发势必成为新的趋势。也是广大同行新的选择。

目录
相关文章
|
7月前
|
JSON IDE 开发工具
鸿蒙开发:基于DevEco Studio插件实现组件化运行
切换模块之后,务必执行以下:Sync and Refresh Project,仅仅切换后执行一次即可,还有就是设置默认的启动页面,也就是每个模块第一次切换时设置一次即可,通常第一次配置之后,后续便不在配置。
207 23
鸿蒙开发:基于DevEco Studio插件实现组件化运行
|
7月前
|
IDE 开发工具
鸿蒙开发:hvigor插件实现组件化运行
目前第一次运行的时候,会在根项目下生成一个harmonyComponent.json5文件,这个文件的主要目的,用于控制插件是否执行,默认为true,每次运行都会执行插件,false不执行插件内容。
155 5
鸿蒙开发:hvigor插件实现组件化运行
|
7月前
|
IDE 数据可视化 开发工具
鸿蒙开发:基于node脚本实现组件化运行
node脚本的方式,需要手动的在终端执行命令,进行切换模块运行,相对于上篇的IDE插件,在效率上有所降低,不过熟练之后,问题不大,目前已经提供了两种方式,大家可以选择自己喜欢的方式。
159 1
鸿蒙开发:基于node脚本实现组件化运行
|
7月前
|
缓存 JavaScript IDE
鸿蒙开发:基于最新API,如何实现组件化运行
手动只是让大家了解切换的原理,在实际开发中,可不推荐手动,下篇文章,我们将通过脚本或者插件,快速实现组件化模块之间的切换,实现独立运行,敬请期待!
213 0
鸿蒙开发:基于最新API,如何实现组件化运行
|
4月前
|
存储 开发者 容器
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
本文介绍了ArkTS语言中的Class类、泛型、接口、模块化、自定义组件及状态管理等核心概念,并结合代码示例讲解了对象属性、构造方法、继承、静态成员、访问修饰符等内容,同时涵盖了路由管理、生命周期和Stage模型等应用开发关键知识点。
425 1
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
|
4月前
|
JavaScript 前端开发 开发者
鸿蒙应用开发从入门到实战(六):ArkTS声明式UI和组件化
鸿蒙开发语言ArkTS在继承了Typescrip语法的基础上,主要扩展了声明式UI开发相关的能力。
249 1
|
3月前
|
移动开发 前端开发 Android开发
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
373 12
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
3月前
|
移动开发 JavaScript 应用服务中间件
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
380 5
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
6月前
|
安全 JavaScript API
鸿蒙开发核心要素
鸿蒙开发核心要素
|
3月前
|
移动开发 Rust JavaScript
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
840 4
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡