项目中需要用到富文本编辑器,于是使用了 tiptap 编辑器,结果在使用中,按下 Enter 键就会报错 Uncaught RangeError: Can not convert <> to a Fragment (looks like multiple versions of prosemirror-model were loaded)
从来没有遇到过的错误 😵 ,很懵逼。谷歌搜寻了一番,找到了问题原因以及解决办法:
Due to prosemirror-model@1.8.2
and prosemirror-model@1.9.0
loaded simultaneously.
tiptap-extensions
package requires strictly version 1.8.2
and other packages prosemirror-model@^1.0.0, prosemirror-model@^1.1.0, prosemirror-model@^1.8.1
which resolves to 1.9.0
Steps to Reproduce / Codesandbox Example
Steps to reproduce the behaviour:
- install
"tiptap": "^1.27.1",
"tiptap-extensions": "^1.29.1"
with Yarn. This will install prosemirror-model@1.8.2
and prosemirror-model@1.9.1
.
- When using the editor (e.g. using ENTER key) it's not working, and we got error in the console
Expected behaviour
Editor should work, there should be only one prosemirror-model
package installed.
Quick and dirty workaround for users (it's not proper fix!) - use resolutions
entry in package.json
:
"resolutions": {
"prosemirror-model": "1.9.1"
}
Then remove node_modules
, yarn.lock
and install packages again.