| <!doctype html> |
| <html lang="en" dir="ltr" class="docs-wrapper plugin-docs plugin-id-default docs-version-current docs-doc-page docs-doc-id-development/plugins/plugin" data-has-hydrated="false"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="generator" content="Docusaurus v3.1.1"> |
| <title data-rh="true">Plugins Development Guide | Apache Answer</title><meta data-rh="true" name="viewport" content="width=device-width,initial-scale=1"><meta data-rh="true" name="twitter:card" content="summary_large_image"><meta data-rh="true" property="og:image" content="https://answer.apache.org/img/head-icon.png"><meta data-rh="true" name="twitter:image" content="https://answer.apache.org/img/head-icon.png"><meta data-rh="true" property="og:url" content="https://answer.apache.org/docs/development/plugins"><meta data-rh="true" property="og:locale" content="en"><meta data-rh="true" property="og:locale:alternate" content="zh_CN"><meta data-rh="true" name="docusaurus_locale" content="en"><meta data-rh="true" name="docsearch:language" content="en"><meta data-rh="true" name="keywords" content="Free, Open-source, Q&A Platform, Knowledge Sharing Platform, Community Forum, Knowledge Base, Developer Hub, Support Center"><meta data-rh="true" name="docusaurus_version" content="current"><meta data-rh="true" name="docusaurus_tag" content="docs-default-current"><meta data-rh="true" name="docsearch:version" content="current"><meta data-rh="true" name="docsearch:docusaurus_tag" content="docs-default-current"><meta data-rh="true" property="og:title" content="Plugins Development Guide | Apache Answer"><meta data-rh="true" name="description" content="Plugins are a way to extend the functionality of the Answer project. You can create your own plugins to meet your own needs."><meta data-rh="true" property="og:description" content="Plugins are a way to extend the functionality of the Answer project. You can create your own plugins to meet your own needs."><link data-rh="true" rel="icon" href="/img/favicon.ico"><link data-rh="true" rel="canonical" href="https://answer.apache.org/docs/development/plugins"><link data-rh="true" rel="alternate" href="https://answer.apache.org/docs/development/plugins" hreflang="en"><link data-rh="true" rel="alternate" href="https://answer.apache.org/zh-CN/docs/development/plugins" hreflang="zh-CN"><link data-rh="true" rel="alternate" href="https://answer.apache.org/docs/development/plugins" hreflang="x-default"><script data-rh="true">var _paq=window._paq=window._paq||[];_paq.push(["setDoNotTrack",!0]),_paq.push(["disableCookies"]),_paq.push(["trackPageView"]),_paq.push(["enableLinkTracking"]),function(){var a="https://analytics.apache.org/";_paq.push(["setTrackerUrl",a+"matomo.php"]),_paq.push(["setSiteId","75"]);var e=document,p=e.createElement("script"),t=e.getElementsByTagName("script")[0];p.async=!0,p.src=a+"matomo.js",t.parentNode.insertBefore(p,t)}()</script><link rel="search" type="application/opensearchdescription+xml" title="Apache Answer" href="/opensearch.xml"> |
| <link rel="alternate" type="application/rss+xml" href="/blog/rss.xml" title="Apache Answer RSS Feed"> |
| <link rel="alternate" type="application/atom+xml" href="/blog/atom.xml" title="Apache Answer Atom Feed"> |
| |
| |
| |
| <link rel="stylesheet" href="/fonts/fonts.css"><link rel="stylesheet" href="/assets/css/styles.dafb0c64.css"> |
| <script src="/assets/js/runtime~main.5c009e72.js" defer="defer"></script> |
| <script src="/assets/js/main.7aa7d472.js" defer="defer"></script> |
| </head> |
| <body class="navigation-with-keyboard"> |
| <script>!function(){function t(t){document.documentElement.setAttribute("data-theme",t)}var e=function(){try{return new URLSearchParams(window.location.search).get("docusaurus-theme")}catch(t){}}()||function(){try{return localStorage.getItem("theme")}catch(t){}}();t(null!==e?e:"light")}(),function(){try{const c=new URLSearchParams(window.location.search).entries();for(var[t,e]of c)if(t.startsWith("docusaurus-data-")){var a=t.replace("docusaurus-data-","data-");document.documentElement.setAttribute(a,e)}}catch(t){}}()</script><div id="__docusaurus"><div role="region" aria-label="Skip to main content"><a class="skipToContent_D8pK" href="#__docusaurus_skipToContent_fallback">Skip to main content</a></div><nav aria-label="Main" class="navbar navbar--fixed-top navbar--primary"><div class="navbar__inner"><div class="navbar__items"><button aria-label="Toggle navigation bar" aria-expanded="false" class="navbar__toggle clean-btn" type="button"><svg width="30" height="30" viewBox="0 0 30 30" aria-hidden="true"><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></button><a class="navbar__brand" href="/"><div class="navbar__logo"><img src="/img/logo.svg" alt="Answer Logo" class="themedImage_Pn4p themedImage--light_PnYV"><img src="/img/logo.svg" alt="Answer Logo" class="themedImage_Pn4p themedImage--dark_eYgw"></div></a><a aria-current="page" class="navbar__item navbar__link navbar__link--active" href="/docs">Docs<!-- --></a><a class="navbar__item navbar__link" href="/plugins">Plugins<!-- --></a><a class="navbar__item navbar__link" href="/blog">Blog<!-- --></a><a class="navbar__item navbar__link" href="/download">Download<!-- --></a><div class="navbar__item dropdown dropdown--hoverable"><a class="navbar__link" aria-haspopup="true" aria-expanded="false" role="button" href="/community/support">Community<!-- --></a><ul class="dropdown__menu"><li><a class="dropdown__link" href="/community/support">Support<!-- --></a></li><li><a href="https://meta.answer.dev" target="_blank" rel="noopener noreferrer" class="dropdown__link">Q&A Community<!-- --></a></li><li><a class="dropdown__link" href="/community/team">Team<!-- --></a></li><li><a class="dropdown__link" href="/community/security">Security<!-- --></a></li><li><a class="dropdown__link" href="/community/security-model">Security Model<!-- --></a></li><li><a class="dropdown__link" href="/community/contributing">Contributing<!-- --></a></li><li><a href="https://github.com/apache/answer/projects" target="_blank" rel="noopener noreferrer" class="dropdown__link">Roadmap<!-- --></a></li></ul></div><div class="navbar__item dropdown dropdown--hoverable"><a href="https://www.apache.org/" target="_blank" rel="noopener noreferrer" aria-haspopup="true" aria-expanded="false" role="button" class="navbar__link">ASF<!-- --></a><ul class="dropdown__menu"><li><a href="https://www.apache.org" target="_blank" rel="noopener noreferrer" class="dropdown__link">Foundation<!-- --></a></li><li><a href="https://www.apache.org/licenses/" target="_blank" rel="noopener noreferrer" class="dropdown__link">License<!-- --></a></li><li><a href="https://www.apache.org/events/current-event.html" target="_blank" rel="noopener noreferrer" class="dropdown__link">Events<!-- --></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank" rel="noopener noreferrer" class="dropdown__link">Sponsorship<!-- --></a></li><li><a href="https://privacy.apache.org/policies/privacy-policy-public.html" target="_blank" rel="noopener noreferrer" class="dropdown__link">Privacy<!-- --></a></li><li><a class="dropdown__link" href="/community/security">Security<!-- --></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank" rel="noopener noreferrer" class="dropdown__link">Thanks<!-- --></a></li></ul></div></div><div class="navbar__items navbar__items--right"><div class="navbar__item dropdown dropdown--hoverable dropdown--right"><a href="#" aria-haspopup="true" aria-expanded="false" role="button" class="navbar__link bi bi-translate"><svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" class="iconLanguage_DSK9"><path fill="currentColor" d="M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z"></path></svg>English<!-- --></a><ul class="dropdown__menu"><li><a href="/docs/development/plugins" target="_self" rel="noopener noreferrer" class="dropdown__link dropdown__link--active" lang="en">English<!-- --></a></li><li><a href="/zh-CN/docs/development/plugins" target="_self" rel="noopener noreferrer" class="dropdown__link" lang="zh-CN">简体中文<!-- --></a></li></ul></div><a href="https://twitter.com/answerdev" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link bi bi-twitter-x navbar-icon-link"></a><a href="https://discord.gg/a6PZZbfnFx" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link bi bi-discord navbar-icon-link"></a><a href="https://github.com/apache/answer" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link bi bi-github navbar-icon-link"></a><div class="searchBox_H2mL"></div></div></div><div role="presentation" class="navbar-sidebar__backdrop"></div></nav><div id="__docusaurus_skipToContent_fallback" class="main-wrapper mainWrapper_eExm"><div class="docsWrapper_utsK"><button aria-label="Scroll back to top" class="clean-btn theme-back-to-top-button backToTopButton_ntye" type="button"></button><div class="docRoot_vZM_"><aside class="theme-doc-sidebar-container docSidebarContainer_VQqE"><div class="sidebarViewport_A4gE"><div class="sidebar_mhZE"><nav aria-label="Docs sidebar" class="menu thin-scrollbar menu_Y1UP"><ul class="theme-doc-sidebar-menu menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/">Introduction<!-- --></a></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="true" href="/docs/installation">Getting Started</a></div><ul style="display:block;overflow:visible;height:auto" class="menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/installation">Installation<!-- --></a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/upgrade">Upgrade<!-- --></a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/command-line">Command Line<!-- --></a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/configfile">Config File<!-- --></a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/env">Environment Variables<!-- --></a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/plugins">Using Plugins<!-- --></a></li></ul></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item menu__list-item--collapsed"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--sublist-caret" aria-expanded="false" href="/docs/questions">User Guides</a></div></li><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-1 menu__list-item"><div class="menu__list-item-collapsible"><a class="menu__link menu__link--sublist menu__link--active" aria-expanded="true" href="/docs/development">Developer Guides</a><button aria-label="Collapse sidebar category 'Developer Guides'" type="button" class="clean-btn menu__caret"></button></div><ul style="display:block;overflow:visible;height:auto" class="menu__list"><li class="theme-doc-sidebar-item-category theme-doc-sidebar-item-category-level-2 menu__list-item"><div class="menu__list-item-collapsible menu__list-item-collapsible--active"><a class="menu__link menu__link--sublist menu__link--active" aria-current="page" aria-expanded="true" tabindex="0" href="/docs/development/plugins">Plugins</a><button aria-label="Collapse sidebar category 'Plugins'" type="button" class="clean-btn menu__caret"></button></div><ul style="display:block;overflow:visible;height:auto" class="menu__list"><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-3 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/development/plugins/plugin-config">Plugin Configuration Schema<!-- --></a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-3 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/development/plugins/plugin-translation">Plugin Translation<!-- --></a></li></ul></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/database">Database<!-- --></a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-2 menu__list-item"><a class="menu__link" tabindex="0" href="/docs/api">API Document<!-- --></a></li></ul></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/notice">Notice<!-- --></a></li><li class="theme-doc-sidebar-item-link theme-doc-sidebar-item-link-level-1 menu__list-item"><a class="menu__link" href="/docs/faq">FAQ<!-- --></a></li></ul></nav></div></div></aside><main class="docMainContainer_dYoB"><div class="container padding-top--md padding-bottom--lg"><div class="row"><div class="col docItemCol_z5aJ"><div class="docItemContainer_c0TR"><article><nav class="theme-doc-breadcrumbs breadcrumbsContainer_Alpn" aria-label="Breadcrumbs"><ul class="breadcrumbs" itemscope="" itemtype="https://schema.org/BreadcrumbList"><li class="breadcrumbs__item"><a aria-label="Home page" class="breadcrumbs__link" href="/"><svg viewBox="0 0 24 24" class="breadcrumbHomeIcon_xK9p"><path d="M10 19v-5h4v5c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-7h1.7c.46 0 .68-.57.33-.87L12.67 3.6c-.38-.34-.96-.34-1.34 0l-8.36 7.53c-.34.3-.13.87.33.87H5v7c0 .55.45 1 1 1h3c.55 0 1-.45 1-1z" fill="currentColor"></path></svg></a></li><li itemscope="" itemprop="itemListElement" itemtype="https://schema.org/ListItem" class="breadcrumbs__item"><a class="breadcrumbs__link" itemprop="item" href="/docs/development"><span itemprop="name">Developer Guides</span></a><meta itemprop="position" content="1"></li><li itemscope="" itemprop="itemListElement" itemtype="https://schema.org/ListItem" class="breadcrumbs__item breadcrumbs__item--active"><span class="breadcrumbs__link" itemprop="name">Plugins</span><meta itemprop="position" content="2"></li></ul></nav><div class="tocCollapsible_FsNm theme-doc-toc-mobile tocMobile_bxCs"><button type="button" class="clean-btn tocCollapsibleButton_a_s8">On this page<!-- --></button></div><div class="theme-doc-markdown markdown"><h1>Plugins Development Guide</h1> |
| <!-- --><p>Plugins are a way to extend the functionality of the Answer project. You can create your own plugins to meet your own needs.</p> |
| <!-- --><div class="theme-admonition theme-admonition-tip admonition_inHR alert alert--success"><div class="admonitionHeading_piGE"><span class="admonitionIcon_ROqA"><svg viewBox="0 0 12 16"><path fill-rule="evenodd" d="M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"></path></svg></span>tip<!-- --></div><div class="admonitionContent_BA39"><p>Viewing the <!-- --><a href="https://github.com/apache/answer-plugins" target="_blank" rel="noopener noreferrer"><strong>official plugin code</strong></a> will make you to quickly understand and learn plugin development.<!-- --></p></div></div> |
| <!-- --><div class="theme-admonition theme-admonition-info admonition_inHR alert alert--info"><div class="admonitionHeading_piGE"><span class="admonitionIcon_ROqA"><svg viewBox="0 0 14 16"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"></path></svg></span>info<!-- --></div><div class="admonitionContent_BA39"><p><strong>Recommended</strong>: Use the official scaffolding tool <!-- --><a href="https://www.npmjs.com/package/create-answer-plugin" target="_blank" rel="noopener noreferrer"><code>create-answer-plugin</code></a> to create and manage plugins. It automates most of the setup process, including file generation, Go module configuration, and plugin installation.<!-- --></p></div></div> |
| <!-- --><h2 class="anchor anchorWithStickyNavbar_loeA" id="introduction">Introduction<!-- --><a href="#introduction" class="hash-link" aria-label="Direct link to Introduction" title="Direct link to Introduction"></a></h2> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="plugin-template-types">Plugin template types<!-- --><a href="#plugin-template-types" class="hash-link" aria-label="Direct link to Plugin template types" title="Direct link to Plugin template types"></a></h3> |
| <!-- --><p>Currently we have three types of plugins:</p> |
| <!-- --><ul> |
| <!-- --><li>Backend plugin</li> |
| <!-- --><li>Standard UI plugin</li> |
| <!-- --><li>Builtin plugin</li> |
| <!-- --></ul> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="plugin-type">Plugin type<!-- --><a href="#plugin-type" class="hash-link" aria-label="Direct link to Plugin type" title="Direct link to Plugin type"></a></h3> |
| <!-- --><p>We classify plugins into different types. Different types of plugins have different functions. Plugins of the same type have the same effect, but are implemented differently.</p> |
| <!-- --><table><thead><tr><th>Plugin Name</th><th>Template Type</th><th>Description</th></tr></thead><tbody><tr><td>Connector</td><td>Backend Plugin</td><td>The Connector plugin helps us to implement third-party login functionality</td></tr><tr><td>Storage</td><td>Backend Plugin</td><td>The Storage plugin helps us to upload files to third-party storage.</td></tr><tr><td>Cache</td><td>Backend Plugin</td><td>Support for using different caching middleware.</td></tr><tr><td>Search</td><td>Backend Plugin</td><td>Support for using search engines to speed up the search for question answers.</td></tr><tr><td>User Center</td><td>Backend Plugin</td><td>Using the third-party user system to manage users.</td></tr><tr><td>Notification</td><td>Backend Plugin</td><td>The Notification plugin helps us to send messages to third-party notification systems.</td></tr><tr><td>Route</td><td>Standard UI Plugin</td><td>Provides support for custom routing.</td></tr><tr><td>Editor</td><td>Standard UI Plugin</td><td>Supports extending the markdown editor's toolbar.</td></tr><tr><td>Captcha</td><td>Standard UI Plugin</td><td>Provides support for captcha.</td></tr><tr><td>Reviewer</td><td>Backend Plugin</td><td>Allows customizing the reviewer functionality.</td></tr><tr><td>Filter</td><td>Backend Plugin</td><td>Filter out illegal questions or answers. (coming soon)</td></tr><tr><td>Render</td><td>Standard UI Plugin</td><td>Parsers for different content formats. (coming soon)</td></tr></tbody></table> |
| <!-- --><h2 class="anchor anchorWithStickyNavbar_loeA" id="create-a-plugin">Create a Plugin<!-- --><a href="#create-a-plugin" class="hash-link" aria-label="Direct link to Create a Plugin" title="Direct link to Create a Plugin"></a></h2> |
| <!-- --><div class="theme-admonition theme-admonition-info admonition_inHR alert alert--info"><div class="admonitionHeading_piGE"><span class="admonitionIcon_ROqA"><svg viewBox="0 0 14 16"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"></path></svg></span>info<!-- --></div><div class="admonitionContent_BA39"><p>The <!-- --><strong>name</strong> field in package.json is the name of the package we add dependencies to; do not use <!-- --><code>_</code> to connect this field naming, please use <!-- --><code>-</code>; for example:<!-- --></p><p>"editor-chart" ✅<!-- --><br> |
| <!-- -->"editor_chart" ❌<!-- --></p></div></div> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="using-the-scaffolding-tool-recommended">Using the Scaffolding Tool (Recommended)<!-- --><a href="#using-the-scaffolding-tool-recommended" class="hash-link" aria-label="Direct link to Using the Scaffolding Tool (Recommended)" title="Direct link to Using the Scaffolding Tool (Recommended)"></a></h3> |
| <!-- --><p>The easiest way to create a plugin is using the official scaffolding tool:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token comment" style="color:#999988;font-style:italic"># Install the tool globally (optional)</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">npm</span><span class="token plain"> </span><span class="token function" style="color:#d73a49">install</span><span class="token plain"> -g create-answer-plugin</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> </span><span class="token function" style="color:#d73a49">add</span><span class="token plain"> -g create-answer-plugin</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># Or use npx directly (recommended)</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx create-answer-plugin create </span><span class="token operator" style="color:#393A34"><</span><span class="token plain">pluginName</span><span class="token operator" style="color:#393A34">></span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or use the alias</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx answer-plugin create </span><span class="token operator" style="color:#393A34"><</span><span class="token plain">pluginName</span><span class="token operator" style="color:#393A34">></span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or use the simplified form</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx answer-plugin </span><span class="token operator" style="color:#393A34"><</span><span class="token plain">pluginName</span><span class="token operator" style="color:#393A34">></span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><p><strong>Note</strong>: The package name is <!-- --><code>create-answer-plugin</code>, but you can use either <!-- --><code>create-answer-plugin</code> or <!-- --><code>answer-plugin</code> as the command (both work!).<!-- --></p> |
| <!-- --><p>The tool will:</p> |
| <!-- --><ol> |
| <!-- --><li>Guide you through an interactive wizard to select the plugin type</li> |
| <!-- --><li>Generate all required files with the correct structure</li> |
| <!-- --><li>Create the Go wrapper file (required for Backend plugins)</li> |
| <!-- --><li>Set up proper <!-- --><code>go.mod</code> with all dependencies<!-- --></li> |
| <!-- --><li>Generate i18n files with the correct structure</li> |
| <!-- --></ol> |
| <!-- --><p><strong>Options:</strong></p> |
| <!-- --><ul> |
| <!-- --><li><code>pluginName</code> (optional): Pre-fill the plugin name<!-- --></li> |
| <!-- --><li><code>--path, -p</code>: Path to Answer project (root directory). If not specified, defaults to current directory.<!-- --></li> |
| <!-- --></ul> |
| <!-- --><p><strong>Example:</strong></p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token comment" style="color:#999988;font-style:italic"># Navigate to your Answer project root</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token builtin class-name">cd</span><span class="token plain"> /path/to/answer</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># Create a plugin</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx create-answer-plugin create my-plugin</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or with path option</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx create-answer-plugin create my-plugin --path /path/to/answer</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># Select: Standard UI Plugin → Route</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># Enter route path: /hello</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><p>The plugin will be created in <!-- --><code>ui/src/plugins/my-plugin/</code> (note: <!-- --><code>plugins</code> is plural).<!-- --></p> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="manual-creation">Manual Creation<!-- --><a href="#manual-creation" class="hash-link" aria-label="Direct link to Manual Creation" title="Direct link to Manual Creation"></a></h3> |
| <!-- --><p>If you prefer to create plugins manually:</p> |
| <!-- --><ol> |
| <!-- --><li> |
| <!-- --><p>Go to the <!-- --><code>ui > src > plugins</code> directory of the project (note: <!-- --><code>plugins</code> is plural).<!-- --></p> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Create your plugin directory and files following the structure of existing plugins.</p> |
| <!-- --></li> |
| <!-- --></ol> |
| <!-- --><h2 class="anchor anchorWithStickyNavbar_loeA" id="run-the-plugin">Run the Plugin<!-- --><a href="#run-the-plugin" class="hash-link" aria-label="Direct link to Run the Plugin" title="Direct link to Run the Plugin"></a></h2> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="install-plugin-automated---recommended">Install Plugin (Automated - Recommended)<!-- --><a href="#install-plugin-automated---recommended" class="hash-link" aria-label="Direct link to Install Plugin (Automated - Recommended)" title="Direct link to Install Plugin (Automated - Recommended)"></a></h3> |
| <!-- --><p>The easiest way to install a plugin is using the scaffolding tool's <!-- --><code>install</code> command:<!-- --></p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token comment" style="color:#999988;font-style:italic"># Navigate to your Answer project root</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token builtin class-name">cd</span><span class="token plain"> /path/to/answer</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># Install a specific plugin (automatically handles registration)</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx create-answer-plugin </span><span class="token function" style="color:#d73a49">install</span><span class="token plain"> my-plugin</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx answer-plugin </span><span class="token function" style="color:#d73a49">install</span><span class="token plain"> my-plugin</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or with path option</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx answer-plugin </span><span class="token function" style="color:#d73a49">install</span><span class="token plain"> my-plugin --path /path/to/answer</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># Install all not installed plugins</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx create-answer-plugin </span><span class="token function" style="color:#d73a49">install</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><p><strong>Options:</strong></p> |
| <!-- --><ul> |
| <!-- --><li><code>plugins</code> (optional): Plugin names to install (defaults to all not installed plugins)<!-- --></li> |
| <!-- --><li><code>--path, -p</code>: Path to Answer project (defaults to current directory)<!-- --></li> |
| <!-- --></ul> |
| <!-- --><p>The <!-- --><code>install</code> command automatically:<!-- --></p> |
| <!-- --><ul> |
| <!-- --><li>✅ Adds plugin import to <!-- --><code>cmd/answer/main.go</code></li> |
| <!-- --><li>✅ Adds <!-- --><code>replace</code> directive to <!-- --><code>go.mod</code></li> |
| <!-- --><li>✅ Runs <!-- --><code>go mod tidy</code></li> |
| <!-- --><li>✅ Merges i18n resources using <!-- --><code>go run ./cmd/answer/main.go i18n</code></li> |
| <!-- --></ul> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="list-plugins">List Plugins<!-- --><a href="#list-plugins" class="hash-link" aria-label="Direct link to List Plugins" title="Direct link to List Plugins"></a></h3> |
| <!-- --><p>List all plugins in the Answer project:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token comment" style="color:#999988;font-style:italic"># List all plugins</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx create-answer-plugin list</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx answer-plugin list</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or with path option</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx answer-plugin list /path/to/answer</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><p><strong>Options:</strong></p> |
| <!-- --><ul> |
| <!-- --><li><code>path</code> (optional): Path to Answer project (defaults to current directory)<!-- --></li> |
| <!-- --></ul> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="uninstall-plugins">Uninstall Plugins<!-- --><a href="#uninstall-plugins" class="hash-link" aria-label="Direct link to Uninstall Plugins" title="Direct link to Uninstall Plugins"></a></h3> |
| <!-- --><p>Uninstall plugins from the Answer project:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token comment" style="color:#999988;font-style:italic"># Uninstall all installed plugins</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx create-answer-plugin uninstall</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx answer-plugin uninstall</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># Uninstall specific plugins</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx create-answer-plugin uninstall my-plugin another-plugin</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic"># or with path option</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx answer-plugin uninstall my-plugin --path /path/to/answer</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><p><strong>Options:</strong></p> |
| <!-- --><ul> |
| <!-- --><li><code>plugins</code> (optional): Plugin names to uninstall (defaults to all installed plugins)<!-- --></li> |
| <!-- --><li><code>--path, -p</code>: Path to Answer project (defaults to current directory)<!-- --></li> |
| <!-- --></ul> |
| <!-- --><p>The <!-- --><code>uninstall</code> command automatically:<!-- --></p> |
| <!-- --><ul> |
| <!-- --><li>✅ Removes plugin import from <!-- --><code>cmd/answer/main.go</code></li> |
| <!-- --><li>✅ Removes <!-- --><code>replace</code> directive from <!-- --><code>go.mod</code></li> |
| <!-- --><li>✅ Runs <!-- --><code>go mod tidy</code></li> |
| <!-- --><li>✅ Updates i18n resources</li> |
| <!-- --></ul> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="run-the-backend-plugin">Run the Backend Plugin<!-- --><a href="#run-the-backend-plugin" class="hash-link" aria-label="Direct link to Run the Backend Plugin" title="Direct link to Run the Backend Plugin"></a></h3> |
| <!-- --><h4 class="anchor anchorWithStickyNavbar_loeA" id="using-the-scaffolding-tool-recommended-1">Using the Scaffolding Tool (Recommended)<!-- --><a href="#using-the-scaffolding-tool-recommended-1" class="hash-link" aria-label="Direct link to Using the Scaffolding Tool (Recommended)" title="Direct link to Using the Scaffolding Tool (Recommended)"></a></h4> |
| <!-- --><ol> |
| <!-- --><li> |
| <!-- --><p>Install the plugin using the scaffolding tool (see above).</p> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Build the frontend:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token builtin class-name">cd</span><span class="token plain"> ui</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> pre-install</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> build</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token builtin class-name">cd</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">..</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Merge i18n resources (if not done automatically):</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token plain">go run ./cmd/answer/main.go i18n</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Start the project:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token plain">go run cmd/answer/main.go run -C ./answer-data</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --></ol> |
| <!-- --><h4 class="anchor anchorWithStickyNavbar_loeA" id="manual-installation">Manual Installation<!-- --><a href="#manual-installation" class="hash-link" aria-label="Direct link to Manual Installation" title="Direct link to Manual Installation"></a></h4> |
| <!-- --><p>If you prefer to install manually:</p> |
| <!-- --><ol> |
| <!-- --><li> |
| <!-- --><p>First, build the frontend:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token builtin class-name">cd</span><span class="token plain"> ui</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> pre-install</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> build</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token builtin class-name">cd</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">..</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>In the <!-- --><code>cmd > answer > main.go</code> file, import your plugin:<!-- --></p> |
| <!-- --><div class="language-go codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-go codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> answercmd </span><span class="token string" style="color:#e3116c">"github.com/apache/answer/cmd"</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// Import the plugins</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token boolean" style="color:#36acaa">_</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">"github.com/apache/answer/ui/src/plugins/my-plugin"</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">)</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Use <!-- --><code>go mod edit</code> to add the plugin to the <!-- --><code>go.mod</code> file:<!-- --></p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token plain">go mod edit -replace</span><span class="token operator" style="color:#393A34">=</span><span class="token plain">github.com/apache/answer/ui/src/plugins/my-plugin</span><span class="token operator" style="color:#393A34">=</span><span class="token plain">./ui/src/plugins/my-plugin</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Update the dependencies:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token plain">go mod tidy</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Merge i18n resources:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token plain">go run ./cmd/answer/main.go i18n</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Start the project:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token plain">go run cmd/answer/main.go run -C ./answer-data</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --></ol> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="run-the-standard-ui-plugin">Run the Standard UI Plugin<!-- --><a href="#run-the-standard-ui-plugin" class="hash-link" aria-label="Direct link to Run the Standard UI Plugin" title="Direct link to Run the Standard UI Plugin"></a></h3> |
| <!-- --><h4 class="anchor anchorWithStickyNavbar_loeA" id="using-the-scaffolding-tool-recommended-2">Using the Scaffolding Tool (Recommended)<!-- --><a href="#using-the-scaffolding-tool-recommended-2" class="hash-link" aria-label="Direct link to Using the Scaffolding Tool (Recommended)" title="Direct link to Using the Scaffolding Tool (Recommended)"></a></h4> |
| <!-- --><ol> |
| <!-- --><li> |
| <!-- --><p>Install the plugin using the scaffolding tool:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token builtin class-name">cd</span><span class="token plain"> /path/to/answer</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">npx create-answer-plugin </span><span class="token function" style="color:#d73a49">install</span><span class="token plain"> my-plugin</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Go to the <!-- --><code>ui</code> directory and install dependencies:<!-- --></p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token builtin class-name">cd</span><span class="token plain"> ui</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> pre-install</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Build the frontend:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> build</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>For development, start the dev server:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> start</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Merge i18n resources (if not done automatically):</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token builtin class-name">cd</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">..</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">go run ./cmd/answer/main.go i18n</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --></ol> |
| <!-- --><h4 class="anchor anchorWithStickyNavbar_loeA" id="manual-installation-1">Manual Installation<!-- --><a href="#manual-installation-1" class="hash-link" aria-label="Direct link to Manual Installation" title="Direct link to Manual Installation"></a></h4> |
| <!-- --><ol> |
| <!-- --><li> |
| <!-- --><p>Go to the <!-- --><code>ui</code> directory.<!-- --></p> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Install the dependencies:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> pre-install</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Build the frontend:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> build</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>For development, start the dev server:</p> |
| <!-- --><div class="language-shell codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-shell codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token function" style="color:#d73a49">pnpm</span><span class="token plain"> start</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --></li> |
| <!-- --><li> |
| <!-- --><p>Refer to the <!-- --><a href="/docs/development/plugins#run-the-backend-plugin">Run the Backend Plugin</a> section and manually add the plugin to the project (import in <!-- --><code>main.go</code>, add <!-- --><code>replace</code> directive, etc.).<!-- --></p> |
| <!-- --></li> |
| <!-- --></ol> |
| <!-- --><h2 class="anchor anchorWithStickyNavbar_loeA" id="backend-plugin-development">Backend Plugin Development<!-- --><a href="#backend-plugin-development" class="hash-link" aria-label="Direct link to Backend Plugin Development" title="Direct link to Backend Plugin Development"></a></h2> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="implement-the-base-interface">Implement the Base interface<!-- --><a href="#implement-the-base-interface" class="hash-link" aria-label="Direct link to Implement the Base interface" title="Direct link to Implement the Base interface"></a></h3> |
| <!-- --><p>The <!-- --><code>Base</code> interface contains basic information about the plugin and is used to display.<!-- --></p> |
| <!-- --><div class="language-go codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-go codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token comment" style="color:#999988;font-style:italic">// Info presents the plugin information</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">type</span><span class="token plain"> Info </span><span class="token keyword" style="color:#00009f">struct</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> Name Translator</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> SlugName </span><span class="token builtin">string</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> Description Translator</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> Author </span><span class="token builtin">string</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> Version </span><span class="token builtin">string</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> Link </span><span class="token builtin">string</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token comment" style="color:#999988;font-style:italic">// Base is the base plugin</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">type</span><span class="token plain"> Base </span><span class="token keyword" style="color:#00009f">interface</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// Info returns the plugin information</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token function" style="color:#d73a49">Info</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> Info</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><div class="theme-admonition theme-admonition-caution admonition_inHR alert alert--warning"><div class="admonitionHeading_piGE"><span class="admonitionIcon_ROqA"><svg viewBox="0 0 16 16"><path fill-rule="evenodd" d="M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"></path></svg></span>caution<!-- --></div><div class="admonitionContent_BA39"><p>The <!-- --><code>SlugName</code> of the plugin must be unique. Two plugins with the same <!-- --><code>SlugName</code> will panic when registering.<!-- --></p></div></div> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="implement-the-function-interface">Implement the function interface<!-- --><a href="#implement-the-function-interface" class="hash-link" aria-label="Direct link to Implement the function interface" title="Direct link to Implement the function interface"></a></h3> |
| <!-- --><div class="theme-admonition theme-admonition-note admonition_inHR alert alert--secondary"><div class="admonitionHeading_piGE"><span class="admonitionIcon_ROqA"><svg viewBox="0 0 14 16"><path fill-rule="evenodd" d="M6.3 5.69a.942.942 0 0 1-.28-.7c0-.28.09-.52.28-.7.19-.18.42-.28.7-.28.28 0 .52.09.7.28.18.19.28.42.28.7 0 .28-.09.52-.28.7a1 1 0 0 1-.7.3c-.28 0-.52-.11-.7-.3zM8 7.99c-.02-.25-.11-.48-.31-.69-.2-.19-.42-.3-.69-.31H6c-.27.02-.48.13-.69.31-.2.2-.3.44-.31.69h1v3c.02.27.11.5.31.69.2.2.42.31.69.31h1c.27 0 .48-.11.69-.31.2-.19.3-.42.31-.69H8V7.98v.01zM7 2.3c-3.14 0-5.7 2.54-5.7 5.68 0 3.14 2.56 5.7 5.7 5.7s5.7-2.55 5.7-5.7c0-3.15-2.56-5.69-5.7-5.69v.01zM7 .98c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.12-7-7 3.14-7 7-7z"></path></svg></span>note<!-- --></div><div class="admonitionContent_BA39"><p>Different plugin types require different interfaces of implementation.</p><p>For example, following is the <!-- --><code>Connector</code> plugin interface.<!-- --></p></div></div> |
| <!-- --><div class="language-go codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-go codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">type</span><span class="token plain"> Connector </span><span class="token keyword" style="color:#00009f">interface</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> Base</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// ConnectorLogoSVG presents the logo in svg format</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token function" style="color:#d73a49">ConnectorLogoSVG</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><span class="token builtin">string</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// ConnectorName presents the name of the connector</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// e.g. Facebook, Twitter, Instagram</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token function" style="color:#d73a49">ConnectorName</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> Translator</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// ConnectorSlugName presents the slug name of the connector</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// Please use lowercase and hyphen as the separator</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// e.g. facebook, twitter, instagram</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token function" style="color:#d73a49">ConnectorSlugName</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><span class="token builtin">string</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// ConnectorSender presents the sender of the connector</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// It handles the start endpoint of the connector</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// receiverURL is the whole URL of the receiver</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token function" style="color:#d73a49">ConnectorSender</span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">ctx </span><span class="token operator" style="color:#393A34">*</span><span class="token plain">GinContext</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> receiverURL </span><span class="token builtin">string</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">redirectURL </span><span class="token builtin">string</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// ConnectorReceiver presents the receiver of the connector</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// It handles the callback endpoint of the connector, and returns the</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token function" style="color:#d73a49">ConnectorReceiver</span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">ctx </span><span class="token operator" style="color:#393A34">*</span><span class="token plain">GinContext</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> receiverURL </span><span class="token builtin">string</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">userInfo ExternalLoginUserInfo</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> err </span><span class="token builtin">error</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><div class="theme-admonition theme-admonition-tip admonition_inHR alert alert--success"><div class="admonitionHeading_piGE"><span class="admonitionIcon_ROqA"><svg viewBox="0 0 12 16"><path fill-rule="evenodd" d="M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"></path></svg></span>tip<!-- --></div><div class="admonitionContent_BA39"><p><code>Translator</code> is a struct for translation. Please refer to <!-- --><a href="/docs/development/plugins/plugin-translation">the documentation</a> for details.<!-- --></p></div></div> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="implement-the-configuration-interface">Implement the configuration interface<!-- --><a href="#implement-the-configuration-interface" class="hash-link" aria-label="Direct link to Implement the configuration interface" title="Direct link to Implement the configuration interface"></a></h3> |
| <!-- --><p>For details on the description of each configuration item, please refer to <!-- --><a href="/docs/development/plugins/plugin-config">the documentation</a>.<!-- --></p> |
| <!-- --><div class="language-go codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-go codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">type</span><span class="token plain"> Config </span><span class="token keyword" style="color:#00009f">interface</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> Base</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// ConfigFields returns the list of config fields</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token function" style="color:#d73a49">ConfigFields</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">[</span><span class="token punctuation" style="color:#393A34">]</span><span class="token plain">ConfigField</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// ConfigReceiver receives the config data, it calls when the config is saved or initialized.</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// We recommend to unmarshal the data to a struct, and then use the struct to do something.</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// The config is encoded in JSON format.</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token comment" style="color:#999988;font-style:italic">// It depends on the definition of ConfigFields.</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token function" style="color:#d73a49">ConfigReceiver</span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">config </span><span class="token punctuation" style="color:#393A34">[</span><span class="token punctuation" style="color:#393A34">]</span><span class="token builtin">byte</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><span class="token builtin">error</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="register-initialization-function">Register initialization function<!-- --><a href="#register-initialization-function" class="hash-link" aria-label="Direct link to Register initialization function" title="Direct link to Register initialization function"></a></h3> |
| <!-- --><div class="language-go codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-go codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">"github.com/apache/answer/plugin"</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">func</span><span class="token plain"> </span><span class="token function" style="color:#d73a49">init</span><span class="token punctuation" style="color:#393A34">(</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> plugin</span><span class="token punctuation" style="color:#393A34">.</span><span class="token function" style="color:#d73a49">Register</span><span class="token punctuation" style="color:#393A34">(</span><span class="token operator" style="color:#393A34">&</span><span class="token plain">GitHubConnector</span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> Config</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> </span><span class="token operator" style="color:#393A34">&</span><span class="token plain">GitHubConnectorConfig</span><span class="token punctuation" style="color:#393A34">{</span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">)</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><h2 class="anchor anchorWithStickyNavbar_loeA" id="standard-ui-plugin-development">Standard UI plugin Development<!-- --><a href="#standard-ui-plugin-development" class="hash-link" aria-label="Direct link to Standard UI plugin Development" title="Direct link to Standard UI plugin Development"></a></h2> |
| <!-- --><p>The default configuration is as follows:</p> |
| <!-- --><div class="language-yaml codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-yaml codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token key atrule" style="color:#00a4db">slug_name</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> <slug_name</span><span class="token punctuation" style="color:#393A34">></span><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token key atrule" style="color:#00a4db">type</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> <type</span><span class="token punctuation" style="color:#393A34">></span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token key atrule" style="color:#00a4db">version</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> 0.0.1</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token key atrule" style="color:#00a4db">author</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><div class="language-tsx codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-tsx codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token imports">i18nConfig</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">'./i18n'</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token imports maybe-class-name">Component</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">'./Component'</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token imports">info</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">'./info.yaml'</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">export</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">default</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> info</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> slug_name</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> info</span><span class="token punctuation" style="color:#393A34">.</span><span class="token property-access">slug_name</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> type</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> info</span><span class="token punctuation" style="color:#393A34">.</span><span class="token property-access">type</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> i18nConfig</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> component</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token maybe-class-name">Component</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">;</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><p>Among them, <!-- --><code>type</code>、<!-- --><code>slug_name</code> and <!-- --><code>component</code> are required fields. <!-- --><code>i18nConfig</code> and <!-- --><code>hooks</code> are optional fields.<!-- --></p> |
| <!-- --><p>Currently the front end supports the following types of plugins:</p> |
| <!-- --><ul> |
| <!-- --><li>editor</li> |
| <!-- --><li>route</li> |
| <!-- --><li>captcha</li> |
| <!-- --></ul> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="editor-plugin">Editor plugin<!-- --><a href="#editor-plugin" class="hash-link" aria-label="Direct link to Editor plugin" title="Direct link to Editor plugin"></a></h3> |
| <!-- --><p>Refer to <!-- --><a href="https://github.com/apache/answer-plugins/tree/main/editor-chart" target="_blank" rel="noopener noreferrer">editor-chart</a> for details.<!-- --></p> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="route-plugin">Route plugin<!-- --><a href="#route-plugin" class="hash-link" aria-label="Direct link to Route plugin" title="Direct link to Route plugin"></a></h3> |
| <!-- --><p>The plugin configuration of the routing type adds the <!-- --><code>route</code> field to the configuration file.<!-- --></p> |
| <!-- --><div class="language-yaml codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-yaml codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token key atrule" style="color:#00a4db">slug_name</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> <slug_name</span><span class="token punctuation" style="color:#393A34">></span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token key atrule" style="color:#00a4db">route</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> /<route</span><span class="token punctuation" style="color:#393A34">></span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token key atrule" style="color:#00a4db">type</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> route</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token key atrule" style="color:#00a4db">version</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> 0.0.1</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token key atrule" style="color:#00a4db">author</span><span class="token punctuation" style="color:#393A34">:</span><span class="token plain"> </span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><div class="language-tsx codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-tsx codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token imports">i18nConfig</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">'./i18n'</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token imports maybe-class-name">Component</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">'./Component'</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> </span><span class="token imports">info</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">'./info.yaml'</span><span class="token punctuation" style="color:#393A34">;</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">export</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">default</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> info</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> slug_name</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> info</span><span class="token punctuation" style="color:#393A34">.</span><span class="token property-access">slug_name</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> type</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> info</span><span class="token punctuation" style="color:#393A34">.</span><span class="token property-access">type</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> route</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> info</span><span class="token punctuation" style="color:#393A34">.</span><span class="token property-access">route</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> i18nConfig</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> component</span><span class="token operator" style="color:#393A34">:</span><span class="token plain"> </span><span class="token maybe-class-name">Component</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">;</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="captcha-plugin">Captcha plugin<!-- --><a href="#captcha-plugin" class="hash-link" aria-label="Direct link to Captcha plugin" title="Direct link to Captcha plugin"></a></h3> |
| <!-- --><p>Refer to <!-- --><a href="https://github.com/apache/answer-plugins/tree/main/captcha-basic" target="_blank" rel="noopener noreferrer">captcha-basic</a> for details.<!-- --></p> |
| <!-- --><h2 class="anchor anchorWithStickyNavbar_loeA" id="builtin-plugin-development">Builtin plugin Development<!-- --><a href="#builtin-plugin-development" class="hash-link" aria-label="Direct link to Builtin plugin Development" title="Direct link to Builtin plugin Development"></a></h2> |
| <!-- --><p>It is not so different from React component, this plugin is more suitable for the following scenarios:</p> |
| <!-- --><ol> |
| <!-- --><li>There are complex business logics that cannot be separated from the code (such as Oauth).</li> |
| <!-- --><li>Some back-end plugins require UI support for business purposes (such as Search).</li> |
| <!-- --><li>This plugin has extremely low requirements for developers and requires no additional configuration work.</li> |
| <!-- --></ol> |
| <!-- --><h3 class="anchor anchorWithStickyNavbar_loeA" id="how-to-develop-builtin-plugin">How to develop builtin plugin<!-- --><a href="#how-to-develop-builtin-plugin" class="hash-link" aria-label="Direct link to How to develop builtin plugin" title="Direct link to How to develop builtin plugin"></a></h3> |
| <!-- --><ol> |
| <!-- --><li><strong>Get familiar with the directory structure</strong>. Go to the <!-- --><code>ui/src/plugins/builtin</code> directory and create a directory, such as Demo. Then refer to the existing plugins to create the necessary files to start development.<!-- --></li> |
| <!-- --></ol> |
| <!-- --><div class="language-txt codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-txt codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token plain">// ui/src/plugins/builtin</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">.</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">├── ...</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain">├── Demo</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> ├── i18n (language file)</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> ├── en_US.yaml (default language required)</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> ├── index.ts (required)</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> ├── zh_CN.ts (any language you want to provide)</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> ├── index.tsx (component required)</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> ├── info.yaml (plugin information required)</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> ├── services.ts (api)</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><ol start="2"> |
| <!-- --><li>Export the plugins you have just defined in the plugins list file <!-- --><code>plugins/builtin/index.ts</code></li> |
| <!-- --></ol> |
| <!-- --><div class="language-ts codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-ts codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token keyword" style="color:#00009f">import</span><span class="token plain"> Demo </span><span class="token keyword" style="color:#00009f">from</span><span class="token plain"> </span><span class="token string" style="color:#e3116c">'./Demo'</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain" style="display:inline-block"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token keyword" style="color:#00009f">export</span><span class="token plain"> </span><span class="token keyword" style="color:#00009f">default</span><span class="token plain"> </span><span class="token punctuation" style="color:#393A34">{</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token operator" style="color:#393A34">...</span><span class="token punctuation" style="color:#393A34">(</span><span class="token plain">exists plugins</span><span class="token punctuation" style="color:#393A34">)</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> Demo</span><span class="token punctuation" style="color:#393A34">,</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"></span><span class="token punctuation" style="color:#393A34">}</span><span class="token punctuation" style="color:#393A34">;</span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><ol start="3"> |
| <!-- --><li>Now you can use the PluginRender component to render the just-defined plugin where you want it!</li> |
| <!-- --></ol> |
| <!-- --><div class="language-ts codeBlockContainer_APcc theme-code-block" style="--prism-color:#393A34;--prism-background-color:#f6f8fa"><div class="codeBlockContent_m3Ux"><pre tabindex="0" class="prism-code language-ts codeBlock_qGQc thin-scrollbar"><code class="codeBlockLines_p187"><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token operator" style="color:#393A34"><</span><span class="token plain">PluginRender</span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> type</span><span class="token operator" style="color:#393A34">=</span><span class="token string" style="color:#e3116c">"connector"</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> slug_name</span><span class="token operator" style="color:#393A34">=</span><span class="token string" style="color:#e3116c">"third_party_connector"</span><span class="token plain"></span><br></span><span class="token-line" style="color:#393A34"><span class="token plain"> </span><span class="token operator" style="color:#393A34">/</span><span class="token operator" style="color:#393A34">></span><br></span></code></pre><div class="buttonGroup_6DOT"><button type="button" aria-label="Copy code to clipboard" title="Copy" class="clean-btn"><span class="copyButtonIcons_FhaS" aria-hidden="true"><svg viewBox="0 0 24 24" class="copyButtonIcon_phi_"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg><svg viewBox="0 0 24 24" class="copyButtonSuccessIcon_FfTR"><path fill="currentColor" d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg></span></button></div></div></div> |
| <!-- --><ol start="4"> |
| <!-- --><li><strong>Publish plugin</strong>: initiate the PR process normally and describe the plugin function and scope of influence in detail.<!-- --></li> |
| <!-- --></ol></div><footer class="theme-doc-footer docusaurus-mt-lg"><div class="theme-doc-footer-edit-meta-row row"><div class="col"><a href="https://github.com/apache/answer-website/edit/main/docs/development/plugins/plugin.md" target="_blank" rel="noopener noreferrer" class="theme-edit-this-page"><svg fill="currentColor" height="20" width="20" viewBox="0 0 40 40" class="iconEdit_N_05" aria-hidden="true"><g><path d="m34.5 11.7l-3 3.1-6.3-6.3 3.1-3q0.5-0.5 1.2-0.5t1.1 0.5l3.9 3.9q0.5 0.4 0.5 1.1t-0.5 1.2z m-29.5 17.1l18.4-18.5 6.3 6.3-18.4 18.4h-6.3v-6.2z"></path></g></svg>Edit this page<!-- --></a></div><div class="col lastUpdated_VsjB"><span class="theme-last-updated">Last updated<!-- --> on <!-- --><b><time datetime="2025-11-30T03:34:59.000Z">Nov 30, 2025</time></b> by <!-- --><b>robin</b></span></div></div></footer></article><nav class="pagination-nav docusaurus-mt-lg" aria-label="Docs pages"><a class="pagination-nav__link pagination-nav__link--prev" href="/docs/development"><div class="pagination-nav__sublabel">Previous<!-- --></div><div class="pagination-nav__label">Development Guide</div></a><a class="pagination-nav__link pagination-nav__link--next" href="/docs/development/plugins/plugin-config"><div class="pagination-nav__sublabel">Next<!-- --></div><div class="pagination-nav__label">Plugin Configuration Schema</div></a></nav></div></div><div class="col col--3"><div class="tableOfContents_fx0E thin-scrollbar theme-doc-toc-desktop"><ul class="table-of-contents table-of-contents__left-border"><li><a href="#introduction" class="table-of-contents__link toc-highlight">Introduction</a><ul><li><a href="#plugin-template-types" class="table-of-contents__link toc-highlight">Plugin template types</a></li><li><a href="#plugin-type" class="table-of-contents__link toc-highlight">Plugin type</a></li></ul></li><li><a href="#create-a-plugin" class="table-of-contents__link toc-highlight">Create a Plugin</a><ul><li><a href="#using-the-scaffolding-tool-recommended" class="table-of-contents__link toc-highlight">Using the Scaffolding Tool (Recommended)</a></li><li><a href="#manual-creation" class="table-of-contents__link toc-highlight">Manual Creation</a></li></ul></li><li><a href="#run-the-plugin" class="table-of-contents__link toc-highlight">Run the Plugin</a><ul><li><a href="#install-plugin-automated---recommended" class="table-of-contents__link toc-highlight">Install Plugin (Automated - Recommended)</a></li><li><a href="#list-plugins" class="table-of-contents__link toc-highlight">List Plugins</a></li><li><a href="#uninstall-plugins" class="table-of-contents__link toc-highlight">Uninstall Plugins</a></li><li><a href="#run-the-backend-plugin" class="table-of-contents__link toc-highlight">Run the Backend Plugin</a></li><li><a href="#run-the-standard-ui-plugin" class="table-of-contents__link toc-highlight">Run the Standard UI Plugin</a></li></ul></li><li><a href="#backend-plugin-development" class="table-of-contents__link toc-highlight">Backend Plugin Development</a><ul><li><a href="#implement-the-base-interface" class="table-of-contents__link toc-highlight">Implement the Base interface</a></li><li><a href="#implement-the-function-interface" class="table-of-contents__link toc-highlight">Implement the function interface</a></li><li><a href="#implement-the-configuration-interface" class="table-of-contents__link toc-highlight">Implement the configuration interface</a></li><li><a href="#register-initialization-function" class="table-of-contents__link toc-highlight">Register initialization function</a></li></ul></li><li><a href="#standard-ui-plugin-development" class="table-of-contents__link toc-highlight">Standard UI plugin Development</a><ul><li><a href="#editor-plugin" class="table-of-contents__link toc-highlight">Editor plugin</a></li><li><a href="#route-plugin" class="table-of-contents__link toc-highlight">Route plugin</a></li><li><a href="#captcha-plugin" class="table-of-contents__link toc-highlight">Captcha plugin</a></li></ul></li><li><a href="#builtin-plugin-development" class="table-of-contents__link toc-highlight">Builtin plugin Development</a><ul><li><a href="#how-to-develop-builtin-plugin" class="table-of-contents__link toc-highlight">How to develop builtin plugin</a></li></ul></li></ul></div></div></div></div></main></div></div></div><footer class="footer"><div class="container py-3"><div class="d-flex justify-content-between flex-wrap text-center"><div><div class="mb-3"><a href="https://www.apache.org/" target="_blank"><svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 525" role="img" style="width:120px"><defs><style>.cls-1{fill:#7c297d}.cls-3{fill:#dd552c}.cls-4{fill:#d22128}</style></defs><path class="cls-1" d="M458.804 181.745h49.045l87.413 220.094h-53.455l-14.777-38.044h-87.406l-15.094 38.044H371.39l87.413-220.094Zm55.65 142.746L483.33 244l-30.814 80.491h61.938ZM622.717 331.722h48.735c.317 21.066 16.037 33.332 40.246 33.332 20.75 0 33.958-8.49 33.958-23.267 0-15.41-14.151-24.526-45.275-31.447-51.57-10.69-76.096-32.066-76.096-68.226 0-39.93 31.757-64.771 82.384-64.771 52.19 0 85.521 28.296 85.521 72.628h-48.11c0-19.806-13.834-31.756-36.785-31.756-21.065 0-33.958 8.806-33.958 23.267 0 13.525 11.634 22.014 45.275 29.871 54.714 12.892 77.665 33.642 77.665 68.542 0 41.505-32.073 66.347-84.262 66.347-55.34 0-89.298-28.929-89.298-74.52ZM852.91 181.745h137.716v45.276h-87.722v55.023h79.859v44.023h-79.86v75.772H852.91V181.745Z"></path><path class="cls-3" d="M141.108 209.888c13.187-32.608 27.9-65.152 43.688-93.997-23.567-17.504-46.196-55.249-55.493-71.972-3.34 3.794-5.508 8.163-6.49 11.718-8.76 31.625 22.42 69.814-2.693 55.861C99.195 99.871 52.08 74.41 34.107 99.717c20.128 25.862 72.773 90.93 107 110.171Z"></path><path d="M184.796 115.891c15.297-27.95 31.6-52.428 48.501-70.063 0 0-16.858 24.4-40.936 73.18 14.582 4.016 56.113 12.256 113.96-2.686 1.422-10.513-5.645-22.075-40.863-25.947-22.993-2.524 27.597-54.902-9.052-79.674a46.281 46.281 0 0 0-3.486-2.14 45.29 45.29 0 0 0-3.911-1.205c-42.803-11.17-48.736 61.409-65.816 45.806-27.6-25.212-45.022-19.321-53.89-9.243 9.297 16.723 31.926 54.468 55.493 71.972Z" style="fill:#f79a23"></path><path class="cls-4" d="M106.682 303.838c9.662-28.946 21.286-61.466 34.426-93.95-34.228-19.241-86.873-84.31-107-110.171-3.594 5.056-6.05 12.108-6.868 21.752-4.39 51.802 49.052 90.153 38.398 97.158-14.092 9.267-42.141-22.26-53.196-2.229 16.023 20.584 48.662 57.777 94.24 87.44Z"></path><path class="cls-3" d="M254.756 192.118c-27.059-9.65 28.276-35.533 46.245-62.991 2.3-3.511 4.676-8.049 5.32-12.805-57.847 14.942-99.378 6.702-113.96 2.686-12.465 25.257-26.859 57.084-41.87 95.458 15.634 6.685 79.47 31.38 169.637 31.507 15.16-39.485-39.691-44.699-65.372-53.855Z"></path><path class="cls-4" d="M117.137 309.049c15.9 4.955 68.584 19.756 124.537 17.528 7.517-20.352-20.586-22.338-22.875-38.661-1.772-12.63 73.957 10.614 98.323-35.311a59.485 59.485 0 0 0 3.006-6.632c-90.167-.127-154.003-24.822-169.637-31.507-10.97 28.044-22.256 59.517-33.354 94.583Z"></path><path class="cls-1" d="M117.137 309.049c-7.145 22.57-14.193 46.682-21.035 72.164a1771.75 1771.75 0 0 0-7.19 27.643c53.106 17.531 102.008.04 103.666-21.638.014-.172-.018-.3-.008-.464 1.264-22.961-33.15-10.234-32.336-24.038.818-13.906 60.081-.081 78.409-29.895a34.139 34.139 0 0 0 3.03-6.244c-55.952 2.228-108.636-12.573-124.536-17.528ZM12.442 216.398c-.774 1.404-1.472 3.026-2.068 4.965-10.292 33.45 62.485 78.385 52.583 88.18-8.925 8.827-20.557-11.343-34.9-3.012a22.05 22.05 0 0 0-4.806 3.75c-16.221 16.619-.254 64.496 45.77 90.052-10.74 36.062-21.432 76.351-31.9 118.486 3.798-1.33 8.342-2.663 9.473-6.245 1.698-6.981 12.194-49.462 29.235-107.094 0 0 3.11-11.806 8.804-31.255a1996.422 1996.422 0 0 1 22.049-70.387c-45.578-29.663-78.217-66.856-94.24-87.44ZM404.167 144.735h9.264v-62.2h23.348v-9.062h-55.96v9.062h23.348v62.2zM464.853 112.958h36.469v31.777h9.358V73.473h-9.358v30.417h-36.47V73.473h-9.256v71.262h9.257v-31.777zM581.403 135.963h-35.17v-23.106h31.588v-8.772h-31.588V82.151h34.106v-8.678h-43.363v71.262h44.427v-8.772z"></path></svg></a></div><div class="fs-14"><div class="my-3"><span>Copyright © 2023 - <!-- -->2025<!-- --> The Apache Software Foundation, Licensed under the Apache License, Version 2.0.<!-- --></span><br><span>Apache, Apache Answer, the Apache logo and the Apache Answer logo are either registered trademarks or trademarks of the Apache Software Foundation in the United States and/or other countries.</span></div><span>Feature icons by <!-- --> <!-- --><a href="https://www.flaticon.com" class="link-secondary" target="_blank">Freepik</a>.<!-- --></span></div></div></div></div></footer></div> |
| </body> |
| </html> |
