I am using CkEditor5 on my React project, it works fine but I cannot use additional features, gives me error toolbarview-item-unavailable.
After configuring with the online builder, I unzipped the zip file, copied the ckeditor.js file under the build folder, and pasted it into my node_modules folder.
What should I do to upload pictures to my React app?
Features I got
Features I want to get
it's my code.
import { CKEditor } from "@ckeditor/ckeditor5-react";
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
...
...
const editorConfiguration = {
toolbar: {
items: [
'heading',
'|',
'fontSize',
'fontFamily',
'fontColor',
'fontBackgroundColor',
'|',
'bold',
'italic',
'underline',
'strikethrough',
'highlight',
'removeFormat',
'|',
'alignment',
'|',
'numberedList',
'bulletedList',
'|',
'indent',
'outdent',
'|',
'todoList',
'link',
'imageUpload',
'blockQuote',
'insertTable',
'|',
'undo',
'redo'
]
},
...
...
return (
<>
...
...
<div className={`col-12 col-lg-${span.inputColSpan + 3}`} id="editor">
<CKEditor
name={option.name}
editor={ClassicEditor}
data={content}
onChange={handleCkeditorState}
onReady={(editor) => {
console.log('editor init..', editor);
}}
OnBlur={(event, editor) => {
console.log('Blur Editor', editor);
}}
onFucus={(event, editor) => {
console.log('Focus Editor', editor);
}}
config={editorConfiguration}
/>
</div>
</>
);
};
import {Editor as ClassicEditor} from '@ckeditor/ckeditor5-build-classic';
or
import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
tried the above import method, but the editor does not open and comes out as a blank screen.



