【HarmonyOS】如何实现应用内引用HSP模块中ArkUI组件

【关键字】

HSP开发、引入HSP模块中ArkUI组件

【写在前面】

在使用ArkTS开发HarmonyOS应用时，通常会定义一些公共组件或公共接口功能，此时可以将这些功能封装到HSP模块中，然后通过在HSP模块中导出组件或接口方式在其他模块中引用，可以实现应用内部代码与资源的共享。这里主要讲如何在entry模块中引用HSP模块中定义ArkUI组件的主要步骤，此处以API9 Stage模型HarmonyOS应用开发为例，hvigor版本为2.4.2。

【开发主要步骤】

步骤1：在HarmonyOS工程项目中，创建HSP模块，HSP模块可以在DevEco Studio中由指定模板创建，此处新增library模块，参考文档如下：

开发动态共享包

​

步骤2：在library模块中定义ArkUI组件，在“library/src/main/ets”目录下新增components文件夹，右键>New>ArkTS File新增名称为“MyTitleBar”的ets组件，如下图所示：

步骤3：在“library/src/main/ets/Index.ets”中导出ArkUI组件，此文件中可支持导出ts类和方法、ArkUI组件、native方法等，如下图所示：

注意：请检查“library/oh-package.json5”中是否添加main配置信息，如下所示：

步骤4：在其他模块就可以导入library模块并使用导出的组件与方法了，此处以entry模块为例，在“entry/oh-package.json5”添加依赖并点击“Sync Now”进行同步，同步后就可以在oh_modules中看到了。

步骤5：在需要使用的地方直接import使用即可。请注意此处不建议通过相对路径方式引用，否则当ArkUI组件中使用资源文件时，使用相对路径引用编译时可能会报错资源找不到。这样就实现引用HSP模块ArkUI组件功能了，其他类型导出和引用实现方式也大致相同，可具体参考相关文档。

【注意事项】

1、import HSP中组件或接口功能时，不建议使用相对路径，如下图所示，这样引入可能会导致编译失败。

2、添加dependencies依赖时，HSP不支持配置在工程级oh-package.json5被其他模块引用，需要配置在各自模块的oh-package.json5内，否则可能会编译运行报错。

【参考文档】

开发和引用动态共享包：开发及引用动态共享包参考

应用内HSP开发指导：应用内HSP开发指导参考