CODEWITHSUNDEEP
angularnpmprose-mirrorngx-editor
Steve Chacko
Steve Chacko

Reputation: 135

RangeError: Can not convert <> to a Fragment (looks like multiple versions of prosemirror-model were loaded)

When using the ngx-editor in my application, it used to work fine, but now when running locally (this issue is only present in my local), I get this error when I am trying to Press Enter and change to a new line. I can type normally and use the toolbar anyway otherwise it is just the enter functionality that does not work. enter image description here

I have tried the solution mentioned in this https://github.com/ueberdosis/tiptap/issues/577 , clearing node_modules and package-lock.json but even then it does not work.

"ngx-editor": "^14.2.0",


  
  "resolutions": {
    "prosemirror-model": "^1.18.1"
  }

This is the HTML code for a rich text area component in my application where the component is being called.

<form [formGroup]="editorForm" class="w-100-p">
    <div class="editor" [class.has-menu]="showMenu">
        <ngx-editor-menu *ngIf="showMenu" [editor]="editor" [toolbar]="toolbar">
        </ngx-editor-menu>
        <ngx-editor (focusIn)="showHideEditorMenuFn(true,$event)" [placeholder]="placeholder" [editor]="editor"
            formControlName="editorContent">
        </ngx-editor>
    </div>
</form>

This component is then called in different parent components as a rich text editor. But currently only one instance of it is being called in every page, but yet this error occurs. Is there any fix?

Upvotes: 2

Views: 2099

Answers (1)

Nardo
Nardo

Reputation: 512

Resolutions only works for YARN. If you are using npm you'd have to do the same but using "overrides" instead of "resolutions". npm does not understand the field resolutions

"overrides": {
    "prosemirror-model": "^1.18.1"
  }

Upvotes: 2

Related Questions