爱意满满的作品展示区。
zhyd1997

记一次 Draftjs 实践

  •  
  •   zhyd1997 · Jul 22, 2020 · 3490 views
  •   You need to sign in to view this topic
    This topic created in 2282 days ago, the information mentioned may be changed or developed.

    github 地址

    Demo

    1. 还有需要哪些 feature (表格、公式、图片、参考文献、自定义模版编译 LaTeX 、创建项目、文件列表...

    2. 做这个编辑器有意义吗

    Supplement 1  ·  Jul 31, 2020
    添加博客地址:[blog]( https://zhangyadong.me/)
    11 replies  •  2020-07-25 01:05:31 +08:00
    find456789
        1
    find456789  
       Jul 22, 2020
    1. marikdown
    2.有
    zhyd1997
        2
    zhyd1997  
    OP
       Jul 22, 2020
    @find456789 markdown 是认真的吗,pandoc 可以把 markdown 转成 latex
    find456789
        3
    find456789  
       Jul 23, 2020
    @YadongZhang

    我不太了解 pandoc, 不过我发现很多社区,如 github,简书,v2 都支持 markdown,并以此为特色 ,所以我猜测,markdown 应该是一个很重要的功能
    zhyd1997
        4
    zhyd1997  
    OP
       Jul 23, 2020 via Android
    @find456789 论文排版编辑器,markdown 用不到
    charten
        5
    charten  
       Jul 23, 2020
    emmm....以前在业务中有用过,遇到 bug 到 github issue 反馈,一年后才回复我,我都已经将业务的富文本替换成我自己写的了(其实就是 contenteditable=true )。
    那时候遇到的问题就是表情图片删除后,导出为 html 后依然还有那张图片。。。
    zhyd1997
        6
    zhyd1997  
    OP
       Jul 23, 2020
    @charten #5 是个大佬。。。
    charten
        7
    charten  
       Jul 24, 2020
    @YadongZhang 掌握浏览器的 range API 其实不是很复杂的。。。。我也是 fork 一个叫 wang editor 的富文本编辑器过来改的,后面把它的代码各种删(不符合我司业务的部分),删到最后就只剩下它里面一个 range 库。。。
    zhyd1997
        8
    zhyd1997  
    OP
       Jul 24, 2020
    @charten #7 原生的坑好多。。。硬核大佬,wang editor 国内人士做的,不清楚实现原理,开箱即用的 CKEditor 5 挺好的,不过太复杂了
    SolidZORO
        9
    SolidZORO  
       Jul 25, 2020
    就我最近二发编辑器经验,如果一个编辑器 Core 没有比较好用的 Table 和 CodeBlock Plugin,很大程度可以说明一些问题。所以,如果你是自研,也请先搞定这两个,熬过来之后,别的功能都很好实现。

    BTW,复杂和困难是两回事。
    SolidZORO
        10
    SolidZORO  
       Jul 25, 2020
    Sorry,打错字,上面「二发」是「二开」。

    你的第二个问题如果是说基于 darft 封装一个开箱即用的我个人觉得是「有意义」的。因为现在市面上的所有富文本编辑器并不是都可以开箱即用的,多多少少都会有一些问题。

    不过你是基于 darft 二开,势必会在「某一个」阶段遇到一个「不可避免」的问题,那就是重写,因为富文本这个领域,如果你不能控制 Core Engine 的一些代码,是很难做到指哪打哪的,到时候会略显被动,例子请参考语雀。

    当然,如果你只是想比较「浅」的基于 darft 二开,我认为你奉献一些 Plugin 就好了。
    zhyd1997
        11
    zhyd1997  
    OP
       Jul 25, 2020
    @SolidZORO table 技术上是可以实现的,正因为是基于 Draftjs 开发,所以我遇到的坑基本上都会是该框架的 bug,知乎编辑器也是用 Draftjs 做的,虽然也有好多问题,比如上述 CodeBlock,但是不影响生产力,不过我做的代码基本上都是官方例子改过来的,所以只是实践应用,算不上开发,东拼西凑做个 latex 编辑器可以少花时间在论文排版上
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   5609 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 137ms · UTC 07:12 · PVG 15:12 · LAX 00:12 · JFK 03:12
    ♥ Do have faith in what you're doing.