[BUG] Not able to use plugin: grapesjs-custom-code

[megarg]

• I am trying to add "custom code plugin" but getting an error in console that "Plugin grapesjs-custom-code not found"

• I have created an react app and this is part of a reach component. Note that this is working fine when I add the plugin from a html page rather than react component.

• This issue is only with "grapesjs-custom-code". "gjs-preset-webpage" is working fine

I may be doing something silly wrong in my react component or there may be a bug. I have been trying to figure this out for hours and need some help please.

Following is my react component code

import React, { Component } from 'react'; import 'grapesjs/dist/css/grapes.min.css'; import 'grapesjs-preset-webpage/dist/grapesjs-preset-webpage.min.css'; import grapesjs from 'grapesjs'; import 'grapesjs-custom-code'; import 'grapesjs-preset-webpage';

export default class grapesjsPresetWebpageWithCustomComponent extends Component { //Prevents ReactJS from working on the same DOM elements as grapesjs. This is //needed to include a non react library under react. See ref at // https://medium.com/@garrettmac/reactjs-how-to-safely-manipulate-the-dom-when-reactjs-cant-the-right-way-8a20928e8a6 shouldComponentUpdate() { return false; }

componentDidMount(){
    var editor = grapesjs.init({
        container : '#gjs',

        plugins: ['gjs-preset-webpage', 'grapesjs-custom-code'],
        pluginsOpts: {
          'grapesjs-custom-code': {
            // options
          },
          'gjs-preset-webpage': {
            // options
            },
        }

    });

}

render() {
    return (
        <div>
            Render Grapesjs here*********
            <div id="gjs"></div>
        </div>
    )
}

}

Following html code works fine:

[megarg]

Let me provide some more details: -----Configuration----- $ node -v v10.15.3

$ npx node-sass -v node-sass 4.12.0 (Wrapper) [JavaScript] libsass 3.5.4 (Sass Compiler) [C/C++]

OS is: Windows 10

Will really appreciate any pointers on why this plugin is giving this error.

[artf]

Hi @megarg actually new plugins (presets are not yet updated) use a new export format which makes this import import 'grapesjs-custom-code'; not usable. You can see the example of usage of new plugins here