插件开发

当标准化的模型驱动界面无法满足特定业务场景需求时，可通过插件机制实现定制化功能扩展。本文将以实体属性表格插件为例，系统介绍插件开发的全流程。该插件需实现基于后端实体属性自动渲染表格列的功能，其核心机制是通过解析数据实体的元数据信息，结合控件参数 showcolumns 动态生成列结构。若 showcolumns 参数存在，则按指定属性集渲染；若参数为空，则默认展示全部属性。所有列数据均从表格配置的默认数据源中动态获取。

定义插件

插件建模是插件开发流程中的首要环节。在此阶段，开发者需完成插件元数据的定义，并建立插件与界面元素的关联关系。

创建插件的第一步是明确插件类型及运行模式（本地插件/远程插件）。iBizHUB 平台支持的插件类型详见插件类型，运行模式的详细说明可参考远程与本地插件。

在本案例中，实体属性表格插件定制的是表格控件，因此插件类型应选择数据表格绘制插件；同时，该插件需独立打包且支持跨项目复用，不影响主项目构建，因此运行模式应选择远程运行时插件。接下来需完善插件的元数据定义，包括插件名称、插件标识及运行时插件仓库配置等。具体配置如下图所示：

关联插件

完成插件创建后，需在对应的表格部件上绑定该插件，以使表格执行插件的自定义逻辑而非默认逻辑。具体配置如下图所示：

创建插件

为了方便插件的开发，我们可以使用官方提供cli工具提供的create-plugin命令生成数据表格绘制插件的默认模板，并根据命令提示依次输入插件名称、插件描述、插件类别、插件运行模式、平台插件标识、插件分组、插件类型等信息。由于当前我们的数据表格绘制插件是独立开发的，没有放置于主项目中，因此我们需要将插件运行模式设置为远程运行时插件。

cli工具包安装和执行流程如下：

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

# 执行create-plugin命令，生成插件模板，可通过参数`o`指定插件输出的目录
$ ibiz-temp create-plugin -o packages

插件生成流程如下图所示：

提示

• 插件名称必须只能由字母和中划线组成
• 插件标识必须只能由字母、数字、下划线组成，并且插件标识必须与创建插件步骤中配置的插件标识保持一致，否则表格绘制时会找不到对应的插件
• 插件类型必须与建模平台上配置的插件类型保持一致，否则表格绘制时会找不到对应的插件
• 插件包的名称由插件分组和插件名称组合而成
• 需根据业务需求选择合适的插件类型和插件运行模式
• 如果是本地插件，因为本地插件和主项目一起构建，则插件输出目录建议指向主项目目录

插件开发

为了方便插件的开发调试，我们需要将插件链接到主项目上，然后再根据业务需求自定义插件逻辑，具体流程如下：

1. 安装依赖并link至全局

# 安装依赖
$ pnpm i

# link底包
$ ./scripts/link.sh

# 启动插件
$ pnpm dev

# link到全局
$ pnpm link --global

2. 主项目中引用插件

# link插件
$ pnpm link --global '@ibiz-plugin-example/entity-field-grid'

3. 主项目中注册插件

import { App } from "vue";
import EntityFieldGrid from "@ibiz-plugin-example/entity-field-grid";

export default {
  install(app: App): void {
    app.use(EntityFieldGrid);
    // 设置本地开发需要忽略加载的插件，可填写正则或全匹配字符串。匹配插件在modeling建模平台配置的[运行时插件仓库配置]内容
    ibiz.plugin.setDevIgnore(/^@ibiz-plugin-example\/entity-field-grid/);
  },
};

4. 根据业务需求自定义插件逻辑

由于我们需要在表格展示实体的属性信息，因此我们可以先拷贝表格部件默认的执行逻辑，然后在表格部件初始化的时候，获取所属实体的所有属性，然后根据属性构建表格列模型，附加到表格部件模型上。插件结构和逻辑如下图所示：

提示

• 如果是本地插件类型，忽略上述步骤1和步骤2，直接在主项目中进行开发即可

插件构建

插件开发完成后，我们执行build命令会生成dist目录，dist目录包含了插件构建后的资源产物。构建插件命令如下：

# 构建插件
npm run build

提示

• 如果是本地插件类型，忽略插件构建步骤，和主项目一起构建即可