React - Cannot read property 'Editor' of undefined

[guzman]

Hi there,

I'm trying to run Kendo Editor on React using the sample that appears on NPM.

I'm using webpack.

This is my component:

var KendoEditor = require('kendo-ui-react-jquery-editor').default;

//Don't forget CSS, webpack used to include CSS
require('../../../Content/Telerik/kendo.common.min.css');
require('../../../Content/Telerik/kendo.default.min.css');
require('../../../Scripts/Telerik/kendo.editor.js');


var Example = React.createClass({
    render: function() {
        return (
          <KendoEditor options={{height: 550,sortable: true}}>

          </KendoEditor>
      );
}
});

module.exports = Example;

This is my view

@Html.React("Client.Example", new { }, clientOnly: true)

 

And I'm already bundling kendo.editor.js and kendo.all.js.

The error that appears is:

Uncaught TypeError: Cannot read property 'Editor' of undefined

On this line:

//note I am not using jQuery plugin to instantiate, don't want to wait for namespace on $.fn
    this.widgetInstance=new _kendoEditor2['default'].ui.Editor(elementNode,this.props.options);//if props are avaliable for events, triggers, unbind events, or methods make it happen now

 

Can you please help? Thanks in advance.

[Alex Gyoshev]

Hello guzman,

Please note that this project is a community effort and is not officially supported. The following reply is a general debugging advice, and any problems in the package should be addressed to the project maintainer.

Since the error occurs on the line this.widgetInstance=new _kendoEditor2['default'].ui.Editor, it means that the .ui part is undefined. The line of code is found in the editor npm package. The imported part (_kendoEditor2['default']) is in this import, so it is likely that the npm plug-in cannot find the proper Kendo UI files.

The files should not be required at the top level, like in the posted snippet:

require('../../../Scripts/Telerik/kendo.editor.js');

Rather, the npm package should load it itself.

Regards,
Alex Gyoshev
Telerik by Progress