插件开发

iBizHUB 插件支持远程插件与本地插件两种加载方式，两种方式的区别可查看远程&本地，开发者可根据实际需求灵活选择。

本地插件

本地插件写在主应用中，会与主应用共同打包。因此本地插件的代码会被整合到主应用的构建产物里，更新本地插件时需要重新打包和部署主应用。以表单部件插件为例，本地插件的开发流程如下：

在modeling建模平台中创建和绑定插件

填写插件名称、插件标识、插件类型、运行时插件模式等信息。运行时插件模式需选择本地运行时插件。
根据插件功能选择合适的插件类型，当前选择自定义部件绘制插件。
在对应的配置中绑定插件，当前在编辑表单配置中绑定。

在主应用中创建插件

通过平台cli工具包的create-plugin指令生成插件模板。根据命令提示依次输入插件名称、插件描述、插件类别、插件运行模式、插件标识、插件类型等信息，然后根据需求调整插件逻辑。

提示

插件名称必须只能由字母和中划线组成。
插件类别需选择平台插件。
插件运行模式需选择本地插件。
插件标识必须只能由字母、数字、下划线组成，并且插件标识必须与上一步在平台创建的插件的插件标识保持一致。
插件类型必须与上一步在平台创建的插件的插件类型保持一致。

# 全局安装cli工具包
pnpm i @ibiz-template/cli -g

# 执行create-plugin指令，生成插件模板，参数`o`为插件输出的目录
ibiz-temp create-plugin -o ./src/plugins

在主应用中注册插件

在主应用中的user-register.ts文件中注册插件。

import { App } from "vue";
import pluginName from "./plugins/plugin-name"; // plugin-name为上一步创建的插件名称，这里应为form-plugin

export default {
  install(app: App): void {
    // 自定义插件注入
    app.use(pluginName);
  },
};

远程插件

远程插件需单独打包，iBizHUB 会通过网络请求的方式懒加载插件。远程插件根据应用场景可分为定制插件和全局插件。

定制插件

若要针对特定业务场景和个性化需求，对特定的组件或逻辑进行定制化的调整，可通过定制插件实现。以表单部件插件为例，其开发流程如下：

在modeling建模平台中创建和绑定插件

填写插件名称、插件标识、插件类型、运行时插件模式、运行时插件名称、运行时插件仓库配置等信息。运行时插件模式需选择远程运行时插件。
根据插件功能选择合适的插件类型，当前选择自定义部件绘制插件。
在对应的配置中绑定插件，当前在编辑表单配置中绑定。

提示

运行时插件仓库配置指定加载的插件包，其内容为包和包的版本信息<package>@<version>，需符合 unpkg 模块规范。

创建插件包

通过平台cli工具包的create-plugin指令生成插件模板。根据提示依次输入插件名称、插件描述、插件类别、插件运行模式、插件标识、插件分组、插件类型等信息，然后根据需求调整插件逻辑。本地开发调试流程可参见插件模板的README文档。

提示

插件名称必须只能由字母和中划线组成。
插件类别需选择平台插件。
插件运行模式需选择远程插件。
插件标识必须只能由字母、数字、下划线组成，并且插件标识必须与上一步在平台创建的插件的插件标识保持一致。
插件类型必须与上一步在平台创建的插件的插件类型保持一致。

# 全局安装cli工具包
pnpm i @ibiz-template/cli -g

# 执行create-plugin指令，生成插件模板，参数`o`为插件输出的目录
ibiz-temp create-plugin -o ./src/plugins

部署插件包

将上一步创建的插件包打包后的构建产物部署到资源服务器上，如 cdn、npm 私有库等。
在主应用的 environment.js 里配置环境变量 pluginBaseUrl，其值需指向插件资源服务器的基础路径，详情参见环境变量。

全局插件

若要对默认的组件或逻辑进行重写，可通过全局插件实现。其开发流程如下：

在modeling建模平台中创建和绑定插件

填写插件名称、插件标识、插件类型、运行时插件模式、运行时插件名称、运行时插件仓库配置等信息。插件标识需填写为GLOBAL_APP_UTIL，运行时插件模式需选择远程运行时插件。
插件类型需选择自定义部件绘制插件。
在前端应用中新建一个应用插件，其插件标识需填写为GLOBAL_APP_UTIL，并在系统前端插件配置中绑定之前创建的远程插件。

提示

全局插件标识固定为GLOBAL_APP_UTIL，不能填写其他的标识。运行时插件仓库配置指定加载的插件包，其内容为包和包的版本信息<package>@<version>，需符合 unpkg 模块规范。

创建插件包

通过平台cli工具包的create-plugin指令生成插件模板。根据提示依次输入插件名称、插件描述、插件类别、插件分组等信息。本地开发调试流程可参见插件模板的README文档。

提示

插件名称必须只能由字母和中划线组成。
插件类别需选择全局插件。

# 全局安装cli工具包
pnpm i @ibiz-template/cli -g

# 执行create-plugin指令，生成插件模板，参数`o`为插件输出的目录
ibiz-temp create-plugin -o ./src/plugins

覆盖应用组件和逻辑

插件内部通过 适配器覆盖 的方式实现全局范围内的功能扩展与逻辑替换。适配器注册标识遵循类型前缀_类型标识的规则（具体标准注册类型详见标准注册类型）。

import { App } from "vue";
import { ControlType, registerControlProvider } from "@ibiz-template/runtime";
import { pluginControl } from "./plugin-control"; // 部件组件
import { pluginControlProvider } from "./plugin-control.provider"; // 部件适配器

export default {
  install(app: App) {
    // 替换标准编辑表单
    app.component(pluginControl.name!, pluginControl);
    registerControlProvider(
      ControlType.FORM,
      () => new pluginControlProvider()
    );
  },
};

部署插件包

将之前创建的插件包打包后的构建产物部署到资源服务器上，如 cdn、npm 私有库等。
在主应用的 environment.js 里配置环境变量 pluginBaseUrl，其值需指向插件资源服务器的基础路径，详情参见环境变量。

插件开发 ​

本地插件 ​

远程插件 ​

定制插件 ​

全局插件 ​

插件开发

本地插件

远程插件

定制插件

全局插件