ZebraEditorCore 是斑码编辑器剔除 UI
框架,纯粹的富文本编辑器,该项目将焦点关注于编辑器最为关键的部分!
yarn add zebra-editor-core
# or
npm i zebra-editor-core
import { mount } from "zebra-editor-core"
mount('root');
目前,市面上流行的富文本编辑器主要有三大类:
-
Markdown
编辑器:结构清晰,但功能有限,比如不能给文字加颜色,设置段落的样式等等。 -
基于
contenteditable
的Html
富文本编辑器,如CKEditor
。功能强大,但不受控,生成的Html
过于混乱,掌控不了文章内容,虽能获取Html
,但却控制不了Html
的结构,不能直接生成非Html
结构,局限性很大,只能做Html
相关的操作,却掌控不了文章的内容。 -
基于
contenteditable
的JS
富文本编辑器,与第二类的区别主要在于:文章结构保存在JS
中,Html
是文章结构的映射,所有的编辑行为实际操作的是JS
内存中的模型,如DraftJs
,但是目前这类的编辑器,功能简单,可操作性不够。
该项目为第三类的富文本编辑器,相较于其他第三类富文本编辑器,它功能丰富,理论上支持所有 Css
属性,支持 Markdown
中所有的类型,包括但不限于 标题、表格、列表、引用、图片等,同时表格、列表、支持多层级嵌套,内容由 JS
表示,很容易就能生成别的类型:如 Markdown
。