Как добавить пользовательский выпадающий плагин «strinsert» в ckeditor4-react?

Question

Я работаю с чтобы использовать текстовый редактор внутри реагирующего приложения. Теперь я хочу добавить раскрывающийся список строк в свой текстовый редактор, для этого я следовал документации «добавить пользовательский плагин» и добавил пользовательский плагин «strinsert».

Внутри папки «node-modules/ckeditor4-react/» я создал папку с именем «plugins» и поместил в нее папку «strinsert».

Теперь мой путь к пользовательским плагинам: «node-modules/ckeditor4-react/plugins/strinsert/plugin.js». Код «plugin.js»:

      CKEDITOR.plugins.add('strinsert',
{
    requires : ['richcombo'],
    init : function( editor )
    {
        //  array of strings to choose from that'll be inserted into the editor
        var strings = [];
        strings.push(['@@FAQ::displayList()@@', 'FAQs', 'FAQs']);
        strings.push(['@@Glossary::displayList()@@', 'Glossary', 'Glossary']);
        strings.push(['@@CareerCourse::displayList()@@', 'Career Courses', 'Career Courses']);
        strings.push(['@@CareerProfile::displayList()@@', 'Career Profiles', 'Career Profiles']);

        // add the menu to the editor
        editor.ui.addRichCombo('strinsert',
        {
            label:      'Insert Content',
            title:      'Insert Content',
            voiceLabel: 'Insert Content',
            className:  'cke_format',
            multiSelect:false,
            panel:
            {
                css: [ editor.config.contentsCss, CKEDITOR.skin.getPath('editor') ],
                voiceLabel: editor.lang.panelVoiceLabel
            },

            init: function()
            {
                this.startGroup( "Insert Content" );
                for (var i in strings)
                {
                    this.add(strings[i][0], strings[i][1], strings[i][2]);
                }
            },

            onClick: function( value )
            {
                editor.focus();
                editor.fire( 'saveSnapshot' );
                editor.insertHtml(value);
                editor.fire( 'saveSnapshot' );
            }
        });
    }
});

После добавления этого я использовал этот плагин внутри текстового редактора, используя конфигурационную поддержку «extraPlugins». Это код моего файла плагина TextEditor (который находится внутри папки «src»)

      class TextEditor extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            editorData: this.props.data
        }
    }

    /** lifecycle method */
    componentDidMount() {
        this.isMount = true;
        this.setState({editorData: this.props.data})
    }
    componentWillUnmount() {
        this.isMount = false;
    }

    /** function to detect the editor changes */
    onEditorChange(event) {
        let data = event.editor.getData()
        this.props.onChange(data)
    }

    // main function
    render() {
        const { editorData } = this.state;
        return (
            <CKEditor
                data={editorData}
                onChange={(e) => this.onEditorChange(e)}
                config={{
                    toolbar: [
                        { name: 'basicstyles', items: ['Bold', 'Italic', 'Underline', 'Strike'] },
                        { name: 'editing', items: ['SelectAll'] },
                        { name: 'clipboard', items: ['Undo', 'Redo'] },
                        { name: 'links', items: ['Link', 'Unlink', 'Anchor'] },
                        { name: 'insert', items: [ 'Image', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar' ] },
                        { name: 'document', items: [ 'Templates', 'Preview', '-', 'Source'] },
                        { name: 'paragraph', items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', 'Blockquote', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock', '-', 'BidiLtr', 'BidiRtl', 'Language'] },
                        { name: 'styles', items: [ 'Styles', 'Format', 'Font', 'FontSize' ] },
                        { name: 'colors', items: [ 'TextColor', 'BGColor' ] },
                        { name: 'tools', items: [ 'Maximize', 'ShowBlocks' ] },
                    ],
                    removePlugins: ['language'],
                    extraPlugins: "strinsert",
            }}
            />
        );
    }
}

export { TextEditor };

После добавления этого, когда я открываю текстовый редактор, он показывает мне ошибку внутри console::Error::

      ckeditor.js:98 GET https://cdn.ckeditor.com/4.15.1/standard-all/plugins/strinsert/plugin.js?t=KA9B 

ckeditor.js:258 Uncaught Error: [CKEDITOR.resourceManager.load] Resource name "strinsert" was not found at "https://cdn.ckeditor.com/4.15.1/standard-all/plugins/strinsert/plugin.js?t=KA9B".
    at window.CKEDITOR.window.CKEDITOR.dom.CKEDITOR.resourceManager.<anonymous> (ckeditor.js:258)
    at n (ckeditor.js:253)
    at Array.v (ckeditor.js:254)
    at y (ckeditor.js:254)
    at HTMLScriptElement.CKEDITOR.env.ie.g.$.onerror (ckeditor.js:255)

Пожалуйста, предложите, как я могу добавить пользовательский плагин «strinsert» в текстовый редактор плагином ckeditor4-react,ckeditor4-react .