TypeError: t is not a constructor

[AnthonyMagnus]

I'm getting a TypeError when adding the plugin to the extraPlugins array of the editor. I'm using the ckeditor5 react package with a custom build. I was able to install the puff-puff package and write the plugin just like in the example. When putting it all together the plugin is unable to load.

import { CKEditor } from '@ckeditor/ckeditor5-react';
import Editor from 'ckeditor5-custom-build/build/ckeditor';
import { CloudinaryUnsigned } from 'puff-puff/CKEditor';

const imagePluginFactory = (editor) => {
    editor.plugins.get('FileRepository').createUploadAdapter = (loader) => new CloudinaryUnsigned(loader, 'xxxx', 'xxxx', [160, 500, 1000, 1052]);
};

const config = {
    extraPlugins: [imagePluginFactory],
    toolbar: ['heading', '|', 'bold', 'italic', 'underline', 'blockquote', 'link', '|', 'alignment:left', 'alignment:center', 'alignment:right', 'alignment:justify', '|', 'imageupload', 'mediaembed', '|', 'bulletedList', 'numberedList', '|', 'undo', 'redo'],
};

const TextEditor = () => {
    const [text, setText] = useState('');

    return (
        <div>
            <CKEditor
                editor={Editor}
                config={config}
                data={text}
                onChange={(event, editor) => {
                    const data = editor.getData();
                    setText(data);
                }}
                onError={(error) => {
                    console.log(error);
                }}
            />
            <div>{text}</div>
        </div>
    );
};

[IyiKuyoro]

Hi @AnthonyMagnus,

I am sorry I am responding to your issue a bit late, I missed the notification. Is this still an issue that requires addressing? If it is, are you using TypeScript for this project?

[AnthonyMagnus]

I changed the code from the config object to the editor object and now it's working. I'm using Javascript.

Code:

<CKEditor
    editor={Editor}
    config={config}
    data={text}
    onChange={(event, editor) => {
        const data = editor.getData();
        setText(data);
    }}
    onError={(error) => {
        console.log(error);
    }}
    onReady={(editor) => {
        editor.plugins.get('FileRepository').createUploadAdapter = (loader) => new CloudinaryUnsigned(loader, 'xxxx', 'xxxx');
    }}
/>

[polly3d]

I changed the code from the config object to the editor object and now it's working. I'm using Javascript.

Code:

<CKEditor
    editor={Editor}
    config={config}
    data={text}
    onChange={(event, editor) => {
        const data = editor.getData();
        setText(data);
    }}
    onError={(error) => {
        console.log(error);
    }}
    onReady={(editor) => {
        editor.plugins.get('FileRepository').createUploadAdapter = (loader) => new CloudinaryUnsigned(loader, 'xxxx', 'xxxx');
    }}
/>

It saves my life, thank you so much.