ReactJs 中的多个 CKEditor5（不同构建） - 以“CKEditorError：ckeditor-duplicated-modules”结尾答案

【问题标题】：Multiple CKEditor5 (of different build) in ReactJs - Ending in 'CKEditorError: ckeditor-duplicated-modules'ReactJs 中的多个 CKEditor5（不同构建） - 以“CKEditorError：ckeditor-duplicated-modules”结尾
【发布时间】：2020-02-22 10:21:45
【问题描述】：

我创建了一个主组件和两个子组件来加载CKeditor5的两个不同版本（经典和气球）；但它给出了以下错误：

CKEditorError: ckeditor-duplicated-modules: Some CKEditor 5 modules 是重复的。阅读更多： https://ckeditor.com/docs/ckeditor5/latest/framework/guides/support/error-codes.html#error-ckeditor-duplicated-modules

第一个组件：

import React from "react";
import CKEditor from "@ckeditor/ckeditor5-react";
import BalloonEditor from "@ckeditor/ckeditor5-build-balloon";

..

return (
<CKEditor
  editor={BalloonEditor}
  //data="<p>Hello from CKEditor 5!</p>" //using placeholder instead
  config={editorConfiguration}
  onInit={editor => {
    // You can store the "editor" and use when it is needed.
    console.log("Editor is ready to use!", editor);
  }}
  onChange={(event, editor) => {
    const data = editor.getData();
    //console.log({ event, editor, data });
  }}
/>);

第二个组件：

import React from "react";
import CKEditor from "@ckeditor/ckeditor5-react";
import ClassicEditor from "@ckeditor/ckeditor5-build-classic";

 ..

return (
    <CKEditor
      editor={BalloonEditor}
      //data="<p>Hello from CKEditor 5!</p>" //using placeholder instead
      config={editorConfiguration}
      onInit={editor => {
        // You can store the "editor" and use when it is needed.
        console.log("Editor is ready to use!", editor);
      }}
      onChange={(event, editor) => {
        const data = editor.getData();
        //console.log({ event, editor, data });
      }}
    />);

主要组件：

return (
  <CardFront />
  <CardBack />
)

关于如何克服这个问题的任何想法？或者这是一个限制？

【问题讨论】：

标签： reactjs ckeditor5 ckeditor5-react

【解决方案1】：

这可能会有所帮助：

创建“超级构建”

单个构建可以导出多少个编辑器类没有限制。默认情况下，官方构建只导出单个编辑器类。但是，他们可以轻松导入更多内容。

您可以从分叉（或复制）现有构建开始，如“创建自定义构建”指南中所述。假设您分叉并克隆了 ckeditor5 存储库，并希望将 InlineEditor 添加到经典版本：

https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/advanced-setup.html#scenario-3-using-two-different-editors

【讨论】：