插件

# 依赖项

在本教程的前一章中，我们了解到编辑器只是一个空壳，而赋予编辑器几乎所有功能的是插件。我们还安装了两个插件，以便能够在编辑器中输入文本。

import { Essentials, Paragraph } from 'ckeditor5';

const editor = await ClassicEditor.create( element, {
    plugins: [
        Essentials,
        Paragraph
    ]
} );

但是，我们实际上安装了更多插件 - 为什么呢？

Essentials 插件是其他插件的包装器，每个插件都提供了您对文本编辑器的基本功能的预期。

• 剪贴板,
• Enter,
• SelectAll,
• ShiftEnter,
• 键入,
• 撤销.

另一个常见模式是插件依赖于其他插件才能正常工作。这通常在给定插件的文档中有所说明，并且编辑器抛出的错误消息将包含有关缺少内容的解释。

由于 Essentials 插件没有定义块级容器，因此我们还安装了 Paragraph 插件来添加对 <p> HTML 标签的支持。

# 插件列表

我们目前创建的编辑器仍然缺少许多功能，例如对标题、表格、块引用等的支持。当然，您可以使用插件添加这些功能。

有关插件列表、使用示例、安装和配置选项，请参阅 插件和 HTML 输出 指南。

# 创建自定义插件

如果编辑器及其任何插件都没有提供您需要的功能，您可能需要创建一个自定义插件。这需要了解编辑器的内部结构，我们将在本教程的后续章节中探索。

我们将创建一个现有的 highlight 插件的简化版本。我们希望能够突出显示文本的某些部分，使其在其他部分中脱颖而出。

如果您遇到任何问题，想查看编写 TypeScript 插件的示例，或者只是想查看我们的 API 的实际操作，请查看 Highlight 插件源代码。

# 注册自定义插件

在上一章中创建的项目中，打开 src/plugin.js 文件。在其中，创建并导出 Highlight 函数。

export function Highlight( editor ) {
    console.log( 'Highlight plugin has been registered' );
}

然后，在 src/main.js 文件中，导入并注册此函数作为编辑器插件。

import { Highlight } from './plugin';

const editor = await ClassicEditor.create( element, {
    plugins: [
        // Other plugins are omitted for readability - do not remove them.
        Highlight
    ]
} );

现在，当页面刷新时，您应该在控制台中看到打印的 Highlight plugin has been registered 文本。这确认了插件构造函数已正确调用。

# 下一步

在下一章中，您将继续创建自定义插件并 详细了解模型和模式，它们控制编辑器的状态。