ckeditor 提到未正确安装且无法工作

Question

我正在使用CKeditor5和react中的ckeditor提及https://ckeditor.com/docs/ckeditor5/latest/features/mentions.html#demo

但是这个包似乎没有正确安装并给出这样的错误

“未捕获的 CKEditorError：ckeditor 重复模块”

当我尝试像这样单独安装时 npm install --save @ckeditor/ckeditor5-react @ckeditor/ckeditor5-build-classic 然后 npm 我@ckeditor/ckeditor5-mention 如果我这样安装 npm install --save @ckeditor/ckeditor5-react @ckeditor/ckeditor5-build-classic @ckeditor/ckeditor5-mention 安装软件包时它给我ckeditor错误

我的代码 `

 import { CKEditor } from '@ckeditor/ckeditor5-react'
 import { Mention } from '@ckeditor/ckeditor5-mention'
 import ClassicEditor from '@ckeditor/ckeditor5-build-classic'

 const CreatePage = () => {
 return (
 <div>
   <h2>CKEditor with Mentions</h2>
   <CKEditor
     editor={ClassicEditor}
      config={{
       plugins: [Mention],
      toolbar: ['mention', 'bold', 'italic', 'link'],
      mention: {
        feeds: [
          {
            marker: '@',
            feed: ['Alice', 'Bob', 'Charlie'], // Replace with your mentionable data
          },
        ],
      },
    }}
  />
 </div>
 )
}

export default CreatePage`

我尝试过单独安装所有模块以及将所有模块安装在一起，但 ckeditor 无法渲染并无法与 @ckeditor/ckeditor5-mention 一起正常工作

Answer 1

当您使用ClassicEditor形式'@ckeditor/ckeditor5-build-classic'时，它确实有Mention插件，所以您不需要安装'@ckeditor/ckeditor5-mention'

     import { CKEditor } from '@ckeditor/ckeditor5-react'
     import ClassicEditor from '@ckeditor/ckeditor5-build-classic'
    
     const CreatePage = () => {
     return (
     <div>
       <h2>CKEditor with Mentions</h2>
       <CKEditor
         editor={ClassicEditor}
         config={{
           mention: {
             feeds: [
               {
                  marker: "@",
                  feed: ["Alice", "Bob", "Charlie"],
                },
              ],
           },
        }}
      />
     </div>
     )
    }
    
    export default CreatePage`