Excuse me, after creating a Plugin through ViewPlugin.define, how to register it to EditorView for work  

v6
1

Excuse me, after creating a Plugin through ViewPlugin.define, how to register it to EditorView for work




2

Include it in your state’s extensions config options.

1 Like
3

this is my test code，I also operate like this，but it didn’t work properly and it threw an error message when executed

let mentionDeco = Decoration.mark({class: "mention"})
let tagDeco = Decoration.mark({class: "hashtag"})
let highlightDeco = Decoration.mark({class: "highlight"})
let decorator = new MatchDecorator({
  regexp: /(a)|(b)|(c)/g,
  decoration: m => m[1] ? mentionDeco : m[2] ? highlightDeco : tagDeco
})

let plugin = ViewPlugin.define(view => ({
  decorations: decorator.createDeco(view),
  update(u) {
    eLogger.info(tag, "decorations update", u)
    this.decorations = decorator.updateDeco(u, this.decorations)
  },
  destroy() {
    eLogger.info(tag, "decorations destroy")
  }
}), {
  decorations: v => v.decorations
})
eLogger.info(tag, "decorations plugin", plugin)
this.editorState = EditorState.create({
  doc: this.logDoc,
  extensions: [basicSetup,plugin]
})
4

this is error msg

Uncaught (in promise) TypeError: Cannot read property 'extension' of undefined
    at inner (index.js?e1ea:1075)
    at inner (index.js?e1ea:1075)
    at inner (index.js?e1ea:1075)
    at inner (index.js?e1ea:1053)
    at flatten (index.js?e1ea:1078)
    at Function.resolve (index.js?e1ea:990)
    at Function.create (index.js?e1ea:1642)
    at Proxy.created (LogEditView.vue?2a2b:50)
    at callWithErrorHandling (runtime-core.esm-bundler.js?5c40:154)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js?5c40:163)
5

That looks like an error you’d get if you had an undefined somewhere in your extension arrays. I don’t see how that would happen with the given code though.

6

thanks,but my all code is here

7

Hi, it really took me a long time to figure out how to add a ViewPlugin to a view. Although this may be mentioned somewhere in the Extension documentation, it isn’t mentioned in the ViewPlugin documentation. Since people don’t read documentation in a particular order, I think it may be an improvement of the documentation to explicitly specify for those extension-types that they can be added as an extension. It would have saved me a lot of searching.
In general (this also applies to the Decoration examples), it often isn’t clear how to wire all the components together into a full view or editor.