GrapesJS / react

Other
95 stars 16 forks source link

No components visible #1

Closed SwapnilSoni1999 closed 10 months ago

SwapnilSoni1999 commented 11 months ago

I've used the starter code from Docs But I cannot see any components

image

artf commented 11 months ago

can you share the exact code?

saltmurai commented 11 months ago

I have the same issue

saltmurai commented 11 months ago

@SwapnilSoni1999 Found the problem. Apparently it's empty because on the README file, the example code doesn't include the plugins option.

import grapesjs from "grapesjs";
import GjsEditor from "@grapesjs/react";

export default function DefaultEditor() {
  const onEditor = (editor) => {
    console.log("Editor loaded", { editor });
  };

  return (
    <GjsEditor
      // Pass the core GrapesJS library to the wrapper (required).
      // You can also pass the CDN url (eg. "https://unpkg.com/grapesjs")
      grapesjs={grapesjs}
      // Load the GrapesJS CSS file asynchronously from URL.
      // This is an optional prop, you can always import the CSS directly in your JS if you wish.
      grapesjsCss="https://unpkg.com/grapesjs/dist/css/grapes.min.css"
      // GrapesJS init options
      options={{
        height: "100vh",
        storageManager: false,
      }}
      plugins={[
        {
          id: "gjs-blocks-basic",
          src: "https://unpkg.com/grapesjs-blocks-basic",
        },
      ]}
      onEditor={onEditor}
    />
  );
}