文章目录
- 前言
- 插件化的核心思路
- 定义插件接口
- PluginManager：插件生命周期管理
- 实战：写一个天气插件
- 核心页面：动态渲染插件 UI
- 动态加载：按需引入
- 踩坑记录
- 小结
前言
做 App 做到一定阶段，总会遇到一个问题：功能越堆越多，包体积越来越大，每次发版都要全量打包。更头疼的是，产品经理说"下周加个 XX 功能"，你一看代码，耦合得一塌糊涂，改一处牵一全身。
这时候就该考虑插件化架构了——核心框架保持稳定，功能以插件形式动态加载、热插拔。今天聊聊怎么在 HarmonyOS 里把这套东西跑通。
插件化的核心思路
插件化说白了就三件事：定义接口、发现插件、加载执行。
核心 App 只负责提供运行环境和插件管理能力，具体功能全部由插件实现。插件之间互相隔离，互不影响，想加就加，想卸就卸。
类比一下：核心 App 是个工具箱，插件就是里面的扳手、螺丝刀、钳子。工具箱本身不做任何修理工作，但它知道怎么收纳和取出工具。
定义插件接口
所有插件必须遵循统一的接口契约，这是插件化的基石。
// plugin/IPlugin.etsexportinterfaceIPlugin{// 插件唯一标识id:string// 插件名称name:string// 插件版本version:string// 初始化，核心 App 传入上下文onInstall(context:PluginContext):void// 激活插件onActivate():void// 停用插件onDeactivate():void// 卸载清理onUninstall():void// 返回插件的主 UI 组件构建器getEntryUI():WrappedBuilder<[PluginContext]>}exportinterfacePluginContext{// 核心 App 提供的能力getApplicationContext():Context// 插件间通信总线eventBus:EventBus// 共享存储服务storage:PluginStorage}这里的关键是getEntryUI()返回一个WrappedBuilder，这样每个插件可以注入自己的 UI 到核心框架里。
PluginManager：插件生命周期管理
这是整套架构的中枢，负责注册、发现、加载、卸载。
// plugin/PluginManager.etsimport{IPlugin,PluginContext}from'./IPlugin'typePluginState='installed'|'active'|'inactive'|'error'interfacePluginEntry{plugin:IPlugin state:PluginState loadTime:number}exportclassPluginManager{privateplugins:Map<string,PluginEntry>=newMap()privatecontext:PluginContextconstructor(context:PluginContext){this.context=context}// 注册插件（不激活）register(plugin:IPlugin):boolean{if(this.plugins.has(plugin.id)){console.warn(`插件${plugin.id}已存在，跳过注册`)returnfalse}try{plugin.onInstall(this.context)this.plugins.set(plugin.id,{plugin,state:'installed',loadTime:Date.now()})this.context.eventBus.emit('plugin:registered',{id:plugin.id})returntrue}catch(e){console.error(`插件${plugin.id}注册失败:${e}`)returnfalse}}// 激活插件activate(id:string):boolean{constentry=this.plugins.get(id)if(!entry)returnfalsetry{entry.plugin.onActivate()entry.state='active'this.context.eventBus.emit('plugin:activated',{id})returntrue}catch(e){entry.state='error'returnfalse}}// 停用插件deactivate(id:string):void{constentry=this.plugins.get(id)if(!entry||entry.state!=='active')returnentry.plugin.onDeactivate()entry.state='inactive'}// 卸载插件uninstall(id:string):void{constentry=this.plugins.get(id)if(!entry)returnentry.plugin.onUninstall()this.plugins.delete(id)this.context.eventBus.emit('plugin:uninstalled',{id})}// 获取所有已激活的插件getActivePlugins():IPlugin[]{constresult:IPlugin[]=[]this.plugins.forEach((entry)=>{if(entry.state==='active'){result.push(entry.plugin)}})returnresult}getPlugin(id:string):IPlugin|undefined{returnthis.plugins.get(id)?.plugin}}这个 Manager 用了 Map 来做插件注册表，每个插件有明确的状态流转：installed → active ⇌ inactive → uninstalled。
实战：写一个天气插件
来看看具体插件怎么写。以天气插件为例：
// plugins/WeatherPlugin.etsimport{IPlugin,PluginContext}from'../plugin/IPlugin'@BuilderfunctionWeatherUI(ctx:PluginContext){Column(){Text('🌤 天气插件').fontSize(20).fontWeight(FontWeight.Bold)Text('北京 · 晴 · 28°C').fontSize(16).margin({top:12})Button('刷新天气').margin({top:16}).onClick(async()=>{ctx.eventBus.emit('weather:refresh',{})})}.padding(20).width('100%')}exportclassWeatherPluginimplementsIPlugin{id='plugin.weather'name='天气'version='1.0.0'privatectx:PluginContext|null=nullonInstall(context:PluginContext):void{this.ctx=context}onActivate():void{console.info('天气插件已激活')}onDeactivate():void{console.info('天气插件已停用')}onUninstall():void{this.ctx=null}getEntryUI():WrappedBuilder<[PluginContext]>{returnwrapBuilder(WeatherUI)}}核心页面：动态渲染插件 UI
核心 App 的页面通过遍历已激活的插件来动态渲染：
// pages/ToolBoxPage.etsimport{PluginManager}from'../plugin/PluginManager'import{WeatherPlugin}from'../plugins/WeatherPlugin'import{CalculatorPlugin}from'../plugins/CalculatorPlugin'import{TranslatePlugin}from'../plugins/TranslatePlugin'@Entry@Componentstruct ToolBoxPage{@StatepluginManager:PluginManager=newPluginManager(this.buildContext())@StateactiveIds:string[]=[]aboutToAppear():void{// 注册所有可用插件this.pluginManager.register(newWeatherPlugin())this.pluginManager.register(newCalculatorPlugin())this.pluginManager.register(newTranslatePlugin())// 默认全部激活this.pluginManager.activate('plugin.weather')this.pluginManager.activate('plugin.calculator')this.pluginManager.activate('plugin.translate')this.refreshList()}buildContext():PluginContext{return{getApplicationContext:()=>getContext(this),eventBus:newEventBus(),storage:newPluginStorage()}}refreshList():void{this.activeIds=this.pluginManager.getActivePlugins().map(p=>p.id)}build(){Column(){Text('工具箱').fontSize(24).margin({bottom:16})ForEach(this.activeIds,(id:string)=>{constplugin=this.pluginManager.getPlugin(id)if(plugin){Column(){plugin.getEntryUI()(this.buildContext())}.margin({bottom:12}).borderRadius(12).backgroundColor('#F5F5F5')}})}.padding(16).width('100%')}}核心页面完全不关心具体插件的实现细节，它只负责"把已激活的插件 UI 渲染出来"。这就是插件化的精髓——核心稳定，扩展开放。
动态加载：按需引入
上面的例子是静态注册。如果想做真正的动态加载，可以利用 HarmonyOS 的动态 import 能力：
asyncfunctionloadPluginDynamically(manager:PluginManager,modulePath:string):Promise<void>{try{constmodule=awaitimport(modulePath)constPluginClass=module.defaultconstplugin=newPluginClass()asIPlugin manager.register(plugin)manager.activate(plugin.id)}catch(e){console.error(`动态加载插件失败:${modulePath},${e}`)}}配合 HAR 模块，可以把每个插件打包成独立的 HAR 包，主 App 按需下载和加载。这样就能实现"用户用到什么功能才下载什么插件"，大幅减小初始包体积。
踩坑记录
实际落地插件化有几个坑要留意：
接口版本兼容。插件接口升级后，老版本插件可能跑不了。建议在PluginContext里加个apiVersion字段，插件注册时做版本校验。
插件间通信。别让插件直接互相引用，全部走 EventBus 中转。这样插件之间完全解耦，替换任何一个都不影响其他。
内存泄漏。插件卸载时一定要调onUninstall做清理，特别是定时器、事件监听这些，不然内存会一直涨。
小结
插件化架构不是银弹，小项目用了反而增加复杂度。但如果你的 App 功能模块多、迭代频繁、需要支持定制化分发（比如不同客户给不同功能组合），插件化就是救星。
我的建议是从项目初期就把核心框架和业务能力分开，哪怕一开始不做动态加载，光把接口定义好、模块边界划清楚，后期要往插件化演进也很容易。最怕的是一开始全部耦合在一起，后面想拆都拆不动。
