Closed Sloosmore closed 6 months ago
The bug comes from pasting the code in the documentation
Just needed to add extensions, closed
@Sloosmore What is the solution exactly?
configure extensions and editor props as well
Can you please guide me, the docs seem a big vague, so I have this below. I get
RangeError: Schema is missing its top node type ('doc')
"use client";
import { EditorContent, EditorRoot } from "novel";
import { useState } from "react";
import { defaultEditorProps } from "novel";
const Editor = () => {
const [content, setContent] = useState(null);
return (
<EditorRoot>
<EditorContent
editorProps={{
...defaultEditorProps,
attributes: {
class: `prose-lg prose-stone dark:prose-invert prose-headings:font-title font-default focus:outline-none max-w-full`,
},
}}
initialContent={content}
onUpdate={({ editor }) => {
const json = editor.getJSON();
setContent(json);
}}
/>
</EditorRoot>
);
};
export default Editor;
follow the rest of the guide and the issue will resolve
@Sloosmore Apparently I did, errors went away, but Editor is no where to be seen.
"use client";
import { defaultEditorProps, EditorContent, EditorRoot } from "novel";
import { defaultExtensions } from "./extensions";
import { useState } from "react";
const Editor = () => {
const [content, setContent] = useState(null);
const extensions = [...defaultExtensions];
return (
<EditorRoot>
<EditorContent
extensions={extensions}
editorProps={{
...defaultEditorProps,
attributes: {
class: `prose-lg prose-stone dark:prose-invert prose-headings:font-title font-default focus:outline-none max-w-full`,
},
}}
initialContent={content}
onUpdate={({ editor }) => {
const json = editor.getJSON();
setContent(json);
}}
/>
</EditorRoot>
);
};
export default Editor;
return (
<SlimLayout>
<Editor />
@Sloosmore Hey i'm facing the same issue can you help me?
@Sloosmore Hey i'm facing the same issue can you help me?
I just fixed this error. You should Follow instructions about extensions from the links below.
https://novel.sh/docs/guides/tailwind/extensions https://novel.sh/docs/guides/tailwind/slash-command
after copy pasting code, there still some errors. I just commented them out and solved the problem. It's looks weird that empty arrayed extensions makes such errors. I hope it helped. :)
Provide environment information
System: OS: macOS 14.3.1 CPU: (12) arm64 Apple M2 Pro Memory: 492.72 MB / 16.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 21.5.0 - /opt/homebrew/bin/node npm: 10.2.4 - /opt/homebrew/bin/npm
Describe the bug
Pasted the default code into a React-vite project and logged the error when rendered:
Uncaught RangeError: Schema is missing its top node type ('doc') at _NodeType.compile (novel.js?v=621d91f9:7773:13) at new Schema (novel.js?v=621d91f9:7859:137) at getSchemaByResolvedExtensions (novel.js?v=621d91f9:17768:10) at new _ExtensionManager (novel.js?v=621d91f9:18114:19) at Editor2.createExtensionManager (novel.js?v=621d91f9:20519:29) at new Editor (novel.js?v=621d91f9:20391:10) at new Editor2 (novel.js?v=621d91f9:48281:5) at novel.js?v=621d91f9:48344:25 at commitHookEffectListMount (chunk-ZRJG7NCB.js?v=10fd422c:16904:34) at commitPassiveMountOnFiber (chunk-ZRJG7NCB.js?v=10fd422c:18152:19)
Link to reproduction
No repo but could upload if needed
To reproduce
"use client";
import { EditorContent, EditorRoot } from "novel"; import { useState } from "react";
const Editor = () => { const [content, setContent] = useState(null); return (
); }; export default Editor;
Additional information