OpenShift 文档正在迁移，很快将仅在 docs.redhat.com（所有 Red Hat 产品文档的中心）提供。立即体验 新的文档体验。
  1. 文档
    2. history bug_report picture_as_pdf
×

动态插件示例

在完成示例操作之前，请按照动态插件开发中的步骤验证插件是否正常工作。

向 Pod 页面添加选项卡

您可以对 OpenShift Container Platform Web 控制台进行不同的自定义。以下步骤将选项卡添加到**Pod 详情**页面，作为插件的示例扩展。

OpenShift Container Platform Web 控制台在一个连接到您已登录的集群的容器中运行。请参阅“动态插件开发”以获取在创建自己的插件之前测试插件的信息。
步骤

  1. 访问包含用于在新选项卡中创建插件的模板的console-plugin-template存储库。

    Red Hat 不支持自定义插件代码。您的插件仅可获得协作社区支持。

  2. 通过单击**使用此模板** → **创建新存储库**来为模板创建一个 GitHub 存储库。

  3. 使用插件名称重命名新存储库。

  4. 将新存储库克隆到本地机器，以便您可以编辑代码。

  5. 编辑package.json文件，将插件的元数据添加到consolePlugin声明中。例如

    "consolePlugin": {
  "name": "my-plugin", (1)
  "version": "0.0.1", (2)
  "displayName": "My Plugin", (3)
  "description": "Enjoy this shiny, new console plugin!", (4)
  "exposedModules": {
    "ExamplePage": "./components/ExamplePage"
  },
  "dependencies": {
    "@console/pluginAPI": "/*"
  }
}
    1 更新插件名称。
    2 更新版本。
    3 更新插件的显示名称。
    4 使用关于插件的概要更新说明。

  6. 将以下内容添加到console-extensions.json文件中

    {
  "type": "console.tab/horizontalNav",
  "properties": {
    "page": {
      "name": "Example Tab",
      "href": "example"
    },
    "model": {
      "group": "core",
      "version": "v1",
      "kind": "Pod"
    },
    "component": { "$codeRef": "ExampleTab" }
  }
}

  7. 编辑package.json文件以包含以下更改

            "exposedModules": {
            "ExamplePage": "./components/ExamplePage",
            "ExampleTab": "./components/ExampleTab"
        }

  8. 通过创建一个名为src/components/ExampleTab.tsx的新文件并添加以下脚本，编写一条要在**Pod**页面上的新自定义选项卡上显示的消息

    import * as React from 'react';

export default function ExampleTab() {
    return (
        <p>This is a custom tab added to a resource using a dynamic plugin.</p>
    );
}

  9. 使用插件名称作为 Helm 发布名称，将 Helm chart 安装到新的命名空间或由-n命令行选项指定的现有命名空间中，以在集群上部署您的插件。使用以下命令，使用plugin.image参数提供镜像的位置

    $ helm upgrade -i  my-plugin charts/openshift-console-plugin -n my-plugin-namespace --create-namespace --set plugin.image=my-plugin-image-location

    有关在集群上部署插件的更多信息，请参阅“在集群上部署插件”。
验证

  • 访问**Pod**页面以查看添加的选项卡。