Need help adding a MenuBarEditorView

I am new to ProseMirror.

I was able to create a basic editor following this tutorial, but I can’t seem to find any doc about adding a basic MenuBarEditorView.

I have tried various pieces of code found on the forum (for example this one), but it always ends with an exception when running them.

Any pointer?

The examples on the website might be helpful, for example the basic one:

const {EditorState} = require("prosemirror-state")
const {MenuBarEditorView} = require("prosemirror-menu")
const {DOMParser} = require("prosemirror-model")
const {schema} = require("prosemirror-schema-basic")
const {exampleSetup} = require("prosemirror-example-setup")

let view = new MenuBarEditorView(document.querySelector("#editor"), {
  state: EditorState.create({
    // Parses a document from the DOM node with id content
    doc: DOMParser.fromSchema(schema).parse(document.querySelector("#content")),
    plugins: exampleSetup({schema})
  })
})
1 Like

Thanks a lot, it works great. Notice that the required css file seems to be missing in the repo (I had to download it from the web site).

You just have to make sure to include the css from the prosemirror-view and prosemirror-menu repositories. In the examples on the website, this is served as a single concatenated CSS file.

1 Like

Works like a charm, thanks.