documate

documate是一个开源工具，旨在无缝地将AI聊天对话集成到您的文档站点中，它使用您上传的文档内容生成实时答案来回答用户问题，有效地充当您文档站点的chatgpt

主要特性

无缝集成

documate可以与大家使用的文档站点流行框架集成（比如他支持了 Vitepress，Docusaurus， Docsify等），此外，他足够灵活，可以集成到您的自定义项目中

易于使用

只需要准寻短短几个步骤，您就能在几分钟内将documate集成到您的文档站点中

完全可控

您拥有代码，拥有数据，甚至可以选择要索引的内容页面

完全可定制

documate提供了可选的文档站点框架，但是你也可以使用自己常用的，按需调整。在现有的项目内引入也是快速和快捷的。

以lowcode-engine的文档站点为例

lowcode-engine docs 在下面这个红色区域新增一个 AI问答

构建documate-backend

documate backend 是一组无服务器函数，用于处理内容上传，和处理问题问答请求。这些函数可以通过单击一下部署到AirCode

为你的文档站点新建一个documate-app

点击进行创建

获取OPENAI_API_KEY

需要注册openai，推荐使用非亚洲的IP

前往 openai 获取或者新建 OPENAI_API_KEY

将OPENAI_API_KEY设置到已创建的documate-app的环境变量中

点击deploy部署

Main EndPoints

到这里documate backend 就部署完成了

有两个主要的点需要了解 upload.js 和 ask.js

upload

此函数处理内容的上传，上传的文件是根据后面提到的documate.json来匹配的。上传所以文件之后，将处理内容以生成特定于您的项目的知识库，然后将其存储在数据库中。

ask

此函数处理问题的问答请求。当用户提出问题后，及前端会向此端点发送请求，然后，函数搜索与知识库中的相关内容，并将其作为上下文转发给OpenAI API。OpenAI API的响应将其作为流返回给前端。

初始化前端项目

我们 clone 了lowcode-engine的项目，并单独看docs文件夹。这是一个现成的 docusaurus 项目。可以参考docusaurus

文档站点connect to documate backend

前端项目创建好之后，需要为前端项目新增一个AI问答的聊天框在这个位置

修改文档站点的navbar配置

pnpm run swizzle @docusaurus/theme-classic NavbarItem/ComponentTypes -- --eject

这个命令会创建一个文件 src/theme/NavbarItem/ComponentTypes.js，修改如下

import { Documate } from '@documate/react'; // 新增
import '@documate/react/dist/style.css';  // 新增

const ComponentTypes = {
  default: DefaultNavbarItem,
  localeDropdown: LocaleDropdownNavbarItem,
  search: SearchNavbarItem,
  dropdown: DropdownNavbarItem,
  html: HtmlNavbarItem,
  doc: DocNavbarItem,
  docSidebar: DocSidebarNavbarItem,
  docsVersion: DocsVersionNavbarItem,
  docsVersionDropdown: DocsVersionDropdownNavbarItem,
  'custom-documate': Documate,  // 新增
};

然后打开 docusaurus.config.js 然后新增Documate UI到 navbar.items：

const config = {
  ...
  themeConfig: {
    navbar: {
      items: [
        ...
        // 新增
        {
          type: 'custom-documate',
          position: 'right',
          endpoint: '',
        },
      ],
    },
  },
}

配置upload 和 ask 两个行为的api

打开你的 documate backend App 选择你的项目内的upload文件，然后选择好这个上传api链接

修改你的documate.json

{
  "root": ".",
  "include": [ "**/*.md", "**/*.mdx" ],
  "backend": "https://test123.us.aircode.run/upload" // 替换成图中保存的链接
}

打开你的 documate backend App 选择你的项目内的ask文件，然后选择好这个处理问题的api链接

修改docusaurus.config.js

const config = {
  ...
  themeConfig: {
    navbar: {
      items: [
        ...
        {
          type: 'custom-documate',
          position: 'right',
          // 替换成图中保存的链接
          endpoint: 'https://test123.us.aircode.run/ask',
        },
      ],
    },
  },
}

查看效果

上面就是所有的配置过程了，非常简单。

执行命令上传md文件pnpm documate:upload

运行文档站点

pnpm start

提问 “注册一个插件”

20分钟制作一个lowcode-engine文档问答机器人