插件

Payload 插件充分利用了 Payload 配置 的模块化特性，使开发者能够通过极小的接入点，轻松地将自定义（有时是复杂的）功能注入到 Payload 应用中。这对于在多个项目之间共享你的工作成果，或者与更广泛的 Payload 社区共享都特别有用。

有许多 官方插件 可用于解决一些最常见的用例，例如 表单构建插件 或 SEO 插件。还有完全由贡献成员维护的 社区插件 可供使用。要以其他方式扩展 Payload 的功能，你可以轻松地 构建自己的插件。

要配置插件，请在你的 Payload 配置 中使用 plugins 属性：

import { buildConfig } from 'payload'

const config = buildConfig({
  // ...
  // highlight-start
  plugins: [
    // 在此处添加插件
  ],
  // highlight-end
})

编写插件并不比编写常规 JavaScript 复杂。如果你了解 回调函数 的基本概念或 展开语法 的工作原理，并且熟悉 Payload 的概念，那么编写插件将轻而易举。

因为我们依赖于简单的基于配置的结构，Payload 插件只需接收现有配置，并返回一个包含新字段、钩子、集合、管理视图或你能想到的任何其他内容的 修改后 配置。

典型应用场景：

  • 当数据被添加或更改时，自动将特定 collection 的数据同步到 HubSpot 或类似 CRM 系统
  • 为某些文档添加密码保护功能
  • 为任何 Payload 应用添加完整的电子商务后端
  • 在 Payload 管理面板中添加自定义报表视图
  • 对特定 collection 的数据进行加密
  • 实现完整的表单构建器功能
  • 将所有启用 upload 的 collection 与第三方文件托管服务（如 S3 或 Cloudinary）集成
  • 添加自定义端点或 GraphQL 查询/变更，实现你能想到的任何类型自定义功能

官方插件

Payload 维护了一系列官方插件，用于解决常见使用场景。这些插件由 Payload 团队及其贡献者维护，保证稳定性和及时更新。

你也可以构建自己的插件以其他方式轻松扩展 Payload 的功能。插件开发完成后，可以考虑与社区分享。

插件生态每天都在变化，请经常查看是否有新插件添加。如果你有特别希望看到的插件，欢迎发起新的讨论。

完整官方插件列表，请访问 Payload Monorepo 的 Packages 目录。

社区插件

社区插件完全由外部贡献者维护。它们是向生态系统分享你的作品供他人使用的好方法。你可以通过浏览 GitHub 上的 payload-plugin 主题来发现社区插件。

有些插件因为被广泛使用而成为了官方插件，例如 Lexical 插件。如果你认为你的插件应该成为官方插件，欢迎发起新的讨论。

为他人构建插件的维护者，请在 GitHub 上添加 payload-plugin 主题，以帮助他人发现你的插件。

示例

基础的 Payload Config 允许配置 plugins 属性，该属性接收一个由 Plugin Configs 组成的 array。

import { buildConfig } from 'payload'
import { addLastModified } from './addLastModified.ts'

const config = buildConfig({
  // ...
  // highlight-start
  plugins: [addLastModified],
  // highlight-end
})

Payload 插件会在传入配置验证通过后执行，但在配置被清理和合并默认选项之前执行。所有插件执行完毕后，带有全部插件的完整配置才会被清理。

以下是上述 addLastModified 插件的可能实现示例。它为所有 Payload collections 添加了一个 lastModifiedBy 字段。完整细节请参阅如何构建自己的插件。

import { Config, Plugin } from 'payload'

export const addLastModified: Plugin = (incomingConfig: Config): Config => {
  // 找出所有启用了身份验证的 collections
  // 以便我们可以为所有身份验证集合创建
  // lastModifiedBy 关联字段
  const authEnabledCollections = incomingConfig.collections.filter(
    (collection) => Boolean(collection.auth),
  )

  // 展开现有配置
  const config: Config = {
    ...incomingConfig,
    collections: incomingConfig.collections.map((collection) => {
      // 展开我们要修改的每个项目，
      // 并添加我们的新字段 - 包含
      // hooks 和正确的 admin UI 配置
      return {
        ...collection,
        fields: [
          ...collection.fields,
          {
            name: 'lastModifiedBy',
            type: 'relationship',
            relationTo: authEnabledCollections.map(({ slug }) => slug),
            hooks: {
              beforeChange: [
                ({ req }) => ({
                  value: req?.user?.id,
                  relationTo: req?.user?.collection,
                }),
              ],
            },
            admin: {
              position: 'sidebar',
              readOnly: true,
            },
          },
        ],
      }
    }),
  }

  return config
}

提醒： 关于如何创建自己的 Payload 插件的更深入说明， 请参阅如何构建自己的插件。