第 7 章 动态插件

流程

1. 使用 plugin__ 为名称添加前缀，以避免命名冲突。插件模板默认使用 plugin__console-plugin-template 命名空间，并在重命名插件时更新，如 plugin__my-plugin。您可以使用 useTranslation hook，例如：

   conster Header: React.FC = () => {
     const { t } = useTranslation('plugin__console-demo-plugin');
     return <h1>{t('Hello, World!')}</h1>;
   };

   Copy to Clipboard Toggle word wrap
   重要

   您必须使用 ConsolePlugin 资源的名称匹配 i18n 命名空间。

2. 根据所需行为设置 spec.i18n.loadType 字段。

   例 7.1. plugin__console-demo-plugin

   spec:
     backend:
       service:
         basePath: /
         name: console-demo-plugin
         namespace: console-demo-plugin
         port: 9001
       type: Service
     displayName: OpenShift Console Demo Plugin
     i18n:
       loadType: Preload 

   1

   Copy to Clipboard Toggle word wrap

   1

   在加载 动态插件后，从 i18n 命名空间中加载所有插件的本地化资源。

3. 对于 console-extensions.json 中的标签，使用 %plugin__console-plugin-template~My Label% 格式。控制台会将值替换为 plugin__console-plugin-template 命名空间中当前语言的消息。例如：

     {
       "type": "console.navigation/section",
       "properties": {
         "id": "admin-demo-section",
         "perspective": "admin",
         "name": "%plugin__console-plugin-template~Plugin Template%"
       }
     }

   Copy to Clipboard Toggle word wrap

4. 在 i18next-parser 的 TypeScript 文件中包含一条注释，将来自 console-extensions.json 的消息添加到您的消息目录中。例如：

   // t('plugin__console-demo-plugin~Demo Plugin')

   Copy to Clipboard Toggle word wrap

5. 要在添加或更改消息时更新插件模板 locales 文件夹中的 JSON 文件，请运行以下命令：

   $ yarn i18n

   Copy to Clipboard Toggle word wrap