I got ReferenceError: document is not defined in nextjs project.

[aholeye]

But, the page is displaying correctly.

[josdejong]

See docs about nextjs: https://github.com/josdejong/svelte-jsoneditor/blob/main/README-VANILLA.md#import-and-use-the-react-component

[aholeye]

It works! Thank you.

[aholeye]

I'm sorry, there is still an issue. When I copy the demo according to the documentation, it works fine. However, when I add a prop mode={Mode.text}, the issue still persists. like this:

        <JSONEditorReact
          content={jsonContent}
          onChange={handler}
          mode={Mode.text}
        />

[aholeye]

After some testing, I have noticed an even stranger phenomenon. Even declaring useState(Mode.tree) within the page causes the same issue. like this:

  const [mode, setMode] = useState(Mode.tree)

even if I haven't used that variable.

[josdejong]

I guess importing Mode to use Mode.tree pulls in the whole library, which gives an issue when rendering server side. You can use the string 'text' instead if that makes life easier. Otherwise, you'll have to import Mode with a dynamic import too.