Код: Выделить всё
import { useState } from "react";
import { CKEditor } from "@ckeditor/ckeditor5-react";
// Standard CSS import for the modern package
import 'ckeditor5/ckeditor5.css';
import {
ClassicEditor,
// Essentials includes Delete, Undo, and Clipboard
Essentials,
Autoformat,
Paragraph,
Heading,
List,
TodoList,
BlockQuote,
Link,
MediaEmbed,
Table,
TableToolbar,
TableCellProperties,
TableProperties,
Bold,
Italic,
Underline,
Strikethrough,
Subscript,
Superscript,
Code,
CodeBlock,
HorizontalLine,
Highlight,
Alignment,
Font,
Indent,
IndentBlock,
RemoveFormat,
Image,
ImageToolbar,
ImageUpload,
ImageCaption,
ImageStyle,
ImageResize,
FileRepository,
type Editor
} from "ckeditor5";
/**
* Custom Upload Adapter for blogging images
*/
function CustomUploadAdapterPlugin(editor: Editor) {
editor.plugins.get("FileRepository").createUploadAdapter = (loader: any) => {
return {
upload: async () => {
const file = await loader.file;
const formData = new FormData();
formData.append("file", file);
const response = await fetch("http://localhost:5000/api/upload", {
method: "POST",
body: formData
});
if (!response.ok) throw new Error("Upload failed");
const data = await response.json();
return { default: data.url };
},
abort: () => {}
};
};
}
export default function TextEditor() {
const [content, setContent] = useState("");
return (
{
const data = editor.getData();
setContent(data);
console.log("Editor content:", data);
}}
/>
);
}
Код: Выделить всё
TextEditor.tsx:72 CKEditor mounting error: CKEditorError: plugincollection-plugin-name-conflict {"pluginName":"Delete"}
Read more: https://ckeditor.com/docs/ckeditor5/latest/support/error-codes.html#error-plugincollection-plugin-name-conflict
at PluginCollection._add (ckeditor5.js?v=bc056d54:47343:13)
at ckeditor5.js?v=bc056d54:47260:14
at Array.map ()
at loadPlugins (ckeditor5.js?v=bc056d54:47257:34)
at PluginCollection.init (ckeditor5.js?v=bc056d54:47139:29)
at ClassicEditor.initPlugins (ckeditor5.js?v=bc056d54:48693:25)
at ckeditor5.js?v=bc056d54:135723:23
at new Promise ()
at ClassicEditor.create (ckeditor5.js?v=bc056d54:135721:12)
at CKEditor._createEditor (@ckeditor_ckeditor5-react.js?v=1371802d:1207:30)
Подробнее здесь: https://stackoverflow.com/questions/798 ... -ckeditor5